Тимур Машнин: Bootstrap: Быстрое создание современных сайтов
Здесь есть возможность читать онлайн «Тимур Машнин: Bootstrap: Быстрое создание современных сайтов» — ознакомительный отрывок электронной книги совершенно бесплатно, а после прочтения отрывка купить полную версию. В некоторых случаях присутствует краткое содержание. ISBN: 9785447462314, издательство: Литагент Ридеро, категория: Прочая околокомпьтерная литература / на русском языке. Описание произведения, (предисловие) а так же отзывы посетителей доступны на портале. Библиотека «Либ Кат» — LibCat.ru создана для любителей полистать хорошую книжку и предлагает широкий выбор жанров:
любовные романы
фантастика и фэнтези
приключения
детективы и триллеры
эротика
документальные
научные
юмористические
анекдоты
о бизнесе
проза
детские
сказки
о религиии
новинки
православные
старинные
про компьютеры
программирование
на английском
домоводство
поэзия
Выбрав категорию по душе Вы сможете найти действительно стоящие книги и насладиться погружением в мир воображения, прочувствовать переживания героев или узнать для себя что-то новое, совершить внутреннее открытие. Подробная информация для ознакомления по текущему запросу представлена ниже:
- Название:Bootstrap: Быстрое создание современных сайтов
- Автор:
- Издательство:Литагент Ридеро
- Жанр:
- Язык:Русский
- ISBN:9785447462314
- Рейтинг книги:3 / 5
- Избранное:Добавить книгу в избранное
- Ваша оценка:
Bootstrap: Быстрое создание современных сайтов: краткое содержание, описание и аннотация
Предлагаем к чтению аннотацию, описание, краткое содержание или предисловие (зависит от того, что написал сам автор книги «Bootstrap: Быстрое создание современных сайтов»). Если вы не нашли необходимую информацию о книге — напишите в комментариях, мы постараемся отыскать её.
Тимур Машнин: другие книги автора
Кто написал Bootstrap: Быстрое создание современных сайтов? Узнайте фамилию, как зовут автора книги и список всех его произведений по сериям.
Уважаемые правообладатели!
Эта книга опубликована на нашем сайте на правах партнёрской программы ЛитРес (litres.ru) и содержит только ознакомительный отрывок. Если Вы против её размещения, пожалуйста, направьте Вашу жалобу на info@libcat.ru или заполните форму обратной связи.
Bootstrap: Быстрое создание современных сайтов — читать онлайн ознакомительный отрывок
Ниже представлен текст книги, разбитый по страницам. Система сохранения места последней прочитанной страницы, позволяет с удобством читать онлайн бесплатно книгу «Bootstrap: Быстрое создание современных сайтов», без необходимости каждый раз заново искать на чём Вы остановились. Поставьте закладку, и сможете в любой момент перейти на страницу, на которой закончили чтение.
Шрифт:
Интервал:
Закладка:
Вопрос 35
Что такое bootstrap метки?
Вопрос 36
Что такое bootstrap бейджики?
Вопрос 37
Что такое Bootstrap Jumbotron?
Вопрос 38
Что такое Bootstrap page header?
Вопрос 39
Как создать миниатюры thumbnails, используя Bootstrap?
Вопрос 40
Как настроить миниатюры, используя Bootstrap?
Вопрос 41
Что такое bootstrap alerts?
Вопрос 42
Как создать bootstrap alert?
Вопрос 43
Как создать Bootstrap Dismissal Alert?
Вопрос 44
Как создать прогресс-бар, используя Bootstrap?
Вопрос 45
Как создать альтернативный индикатор, используя bootstrap?
Вопрос 46
Как создать прогресс-бар в полоску, используя bootstrap?
Вопрос 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
Возьмем в качестве примера простой шаблон с фиксированной шириной, с меню, боковой панелью, контентом и подвалом.
E-mail:Заменим DOCTYPE на .
Атрибут lang в теге html и атрибут charset тега meta уже имеются.
В начало тега
добавим:В тег
добавим:Обернем заголовок в класс. container и, используя Bootstrap Grid System и Bootstrap Navigation Bar, разместим меню, логотип и форму поиска в шапке.
(function () {
var cx = «»;
var gcse = document.createElement (’script’);
gcse. type = ’text/javascript’;
gcse.async = true;
gcse.src = (document.location.protocol == ’https:'? ’https:': ’http:») +
'//cse.google.com/cse. js? cx=' + cx;
var s = document.getElementsByTagName (’script’) [0];
s.parentNode.insertBefore (gcse, s);
}) ();
.gsc-search-button {
display: none;
}
.gsib_a {
height:40px;
}
.gsc-input-box {
height: 40px;
}
Уберем боковую панель и свой файл CSS, вместо него добавим CSS стили:
body {
font-size:18px;
font-famile: Georgia;
color: #000;
margin: 0;
padding: 0;
background: gray;
}
.header {
/* Permalink – use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e1ffff+0,e1ffff+4,fdffff+7,fdffff+7,e1ffff+17,e6f8fd+28,c8eefb+47,bee4f8+68,b1d8f5+100 */
background: #e1ffff; /* Old browsers */
background: -moz-linear-gradient (top, #e1ffff 0%, #e1ffff 4%, #fdffff 7%, #fdffff 7%, #e1ffff 17%, #e6f8fd 28%, #c8eefb 47%, #bee4f8 68%, #b1d8f5 100%); /* FF3.6—15 */
background: -webkit-linear-gradient (top, #e1ffff 0%,#e1ffff 4%,#fdffff 7%,#fdffff 7%,#e1ffff 17%,#e6f8fd 28%,#c8eefb 47%,#bee4f8 68%,#b1d8f5 100%); /* Chrome10—25,Safari5.1—6 */
background: linear-gradient (to bottom, #e1ffff 0%,#e1ffff 4%,#fdffff 7%,#fdffff 7%,#e1ffff 17%,#e6f8fd 28%,#c8eefb 47%,#bee4f8 68%,#b1d8f5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient (startColorstr=«#e1ffff’, endColorstr=«#b1d8f5», GradientType=0); /* IE6—9 */
}
.inverse-dropdown {
background-color: black;
}
.inverse-dropdown li a {
color: white;
}
.inverse-dropdown li a: hover {
color: black;
}
.content {
background: lightgrey;
}
.footer {
/* Permalink – use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,2989d8+86,207cca+93,7db9e8+100 */
background: #1e5799; /* Old browsers */
background: -moz-radial-gradient (center, ellipse cover, #1e5799 0%, #2989d8 86%, #207cca 93%, #7db9e8 100%); /* FF3.6—15 */
background: -webkit-radial-gradient (center, ellipse cover, #1e5799 0%,#2989d8 86%,#207cca 93%,#7db9e8 100%); /* Chrome10—25,Safari5.1—6 */
background: radial-gradient (ellipse at center, #1e5799 0%,#2989d8 86%,#207cca 93%,#7db9e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient (startColorstr=«#1e5799», endColorstr=«#7db9e8», GradientType=1); /* IE6—9 fallback on horizontal gradient */
}
.navigation {
margin: 10px 20px; padding-bottom: 10px;
width: 560px;
}
.navigation a: link,
.navigation a: visited {
float: left;
display: block;
margin: 10px 10px 0 0;
padding: 5px 7px;
text-transform: lowercase;
text-decoration: none;
font-weight: bold;
color: #fff;
background: #2C76A6;
border-width: 1px;
border-style: solid;
border-color: #86BBDF #245F86 #245F86 #86BBDF;
}
.navigation a: hover {
background: #FF3399;
border-width: 1px;
border-style: solid;
border-color: #FF75BA #EA0075 #EA0075 #FF75BA;
}
Таким образом, исключим из шаблона все фоновые изображения, которые могут создавать горизонтальную прокрутку, заменим фоновые изображения на CSS градиенты.
Обернем контент и подвал в класс. container и используем Bootstrap Grid System.
Top
Bootstrap Text/Typography
По умолчанию, глобальный размер шрифта Bootstrap, применяемый к тегу
Шрифт:
Интервал:
Закладка:
Похожие книги на «Bootstrap: Быстрое создание современных сайтов»
Представляем Вашему вниманию похожие книги на «Bootstrap: Быстрое создание современных сайтов» списком для выбора. Мы отобрали схожую по названию и смыслу литературу в надежде предоставить читателям больше вариантов отыскать новые, интересные, ещё не прочитанные произведения.
Обсуждение, отзывы о книге «Bootstrap: Быстрое создание современных сайтов» и просто собственные мнения читателей. Оставьте ваши комментарии, напишите, что Вы думаете о произведении, его смысле или главных героях. Укажите что конкретно понравилось, а что нет, и почему Вы так считаете.