Bootstrap: Быстрое создание современных сайтов. Тимур Машнин
Чтение книги онлайн.

Читать онлайн книгу Bootstrap: Быстрое создание современных сайтов - Тимур Машнин страница 4

СКАЧАТЬ style="font-size:15px;">      Вопрос 47

      Как создать анимированный прогресс-бар, используя bootstrap?

      Вопрос 48

      Как создать набор индикаторов, используя bootstrap?

      Вопрос 49

      Что такое bootstrap медиа-объекты?

      Вопрос 50

      Что является целью. media класса в bootstrap?

      Вопрос 51

      Что является целью. media-list класса в bootstrap?

      Вопрос 52

      Что такое bootstrap panels?

      Вопрос 53

      Как создать bootstrap панель с заголовком?

      Вопрос 54

      Как создать bootstrap панель с подвалом?

      Вопрос 55

      Какие контекстные классы доступны для оформления панелей?

      Вопрос 56

      Можете ли вы поместить таблицу в bootstrap панели?

      Вопрос 57

      Можете ли вы поместить listgroup внутри bootstrap панели?

      Вопрос 58

      Что такое bootstrap well?

      Вопрос 59

      Что такое Scrollspy плагин?

      Вопрос 60

      Что такое affix плагин?

      Быстрая адаптация сайта для мобильных устройств с помощью Bootstrap

      Возьмем в качестве примера простой шаблон с фиксированной шириной, с меню, боковой панелью, контентом и подвалом.

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN» "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

      <html xmlns="http://www.w3.org/1999/xhtml" xml: lang=«en» lang=«en»>

      <head>

      <title> </title>

      <meta http-equiv=«content-type» content=«application/xhtml+xml; charset=UTF-8» />

      <meta name=«author» content=«» />

      <meta name=«description» content=«» />

      <meta name=«robots» content=«index, follow» />

      <link rel=«stylesheet» type=«text/css» media=«screen» href="/file/theme/css/screen. css» />

      </head>

      <body>

      <! – header – >

      <div id=«header-wrap»> <div id=«header»>

      <a name=«top»> </a>

      <h1 id=«logo-text»> <a href=«#» title=«»> </a> </h1>

      <p id=«slogan»> </p>

      <div id=«nav»>

      <ul>

      <li> <a href=«»> Home </a> </li>

      <li> <a href=«#»> Page1 </a>

      <ul style=«height: auto; overflow: auto»>

      <li> <a href=«#»> Page1—1 </a> </li>

      </ul>

      </li>

      <li> <a href=«#»> Page2 </a>

      <ul style=«height: auto; overflow: auto»>

      <li> <a href=«#»> Page2—1 </a> </li>

      <li> <a href=«#»> Page2—1 </a> </li>

      </ul>

      </li>

      </ul>

      </div>

      <div id=«google-search»>

      <script>

      (function () {

      var cx = «»;

      var gcse = document.createElement (’script’);

      gcse. type = ’text/javascript’;

      gcse.async = true;

      gcse.src = (document.location.protocol == ’https:'? ’https:': ’http:») +

      «//www.google.com/cse/cse.js?cx=' + cx;

      var s = document.getElementsByTagName (’script’) [0];

      s.parentNode.insertBefore (gcse, s);

      }) ();

      </script>

      <gcse: search> </gcse: search>

      </div>

      </div>

      </div>

      <! – СКАЧАТЬ