• 0 Items - 0.00лв.
    • Количката е празна

Адаптивен уеб дизайн с Bootstrap

Share

Тук можете да свалите кода, използван в книгата.

Bootstrap е един от най-популярните фреймуърки за HTML, CSS, и JavaScript. Той съдържа набор от инструменти за създаване на сайтове и уеб приложения: HTML/CSS шаблони за оформление на страници, уеб форми, етикети, навигационни блокове и други елементи на уеб интерфейса.

С Bootstrap може да създадете динамичен дизайн, който се разтяга и свива, адаптирайки се към различните резолюции на екраните. Ще разберете как да създавате код, който да се визуализира по един и същи начин на най-различни устройства – смартфони, таблети, настолни компютри и лаптопи.

Освен, че ще ви научи да правите модерни сайтове с адаптивен дизайн, тази книга ще ви спести и доста време, понеже много от елементите на уеб интерфейса вече са направени и няма да ви се налага да изобретявате велосипеда отново. Решетки, шаблони, таблици, форми, панели, списъци, превключватели, навигация, класове – всичко това може бързо да бъде реализирано с Bootstrap.

Представен е специалният jQuery-плъгин, който ви дава възможност да „придадете“ динамика на вашия сайт. Отделено е и нужното внимание на техниките за оптимизация на сайт, създаден с Bootstrap или с всеки друг front-end фреймуърк.

В книгата ще намерите и реален пример на сайт, създаден с Bootstrap, а авторът се е погрижил да ви предостави и архив, съдържащ примерите от книгата, дистрибуция на Bootstrap и друго полезно програмно обезпечение.

Адаптивен уеб дизайн с Bootstrap
Година

2017

Корици

Меки

Преводач

Влади Владев

Страници

184

Формат

159х235

Съдържание

Въведение…5
История на фреймуърка Bootstrap…6
Предимства и недостатъци…6
Как да се чете тази книга?…8
Архив…9

Глава 1. Защо именно Bootstrap?…10
1.1. Ориентация към мобилен дизайн…10
1.2. Възможности на Bootstrap…12
1.3. За кого ще бъде полезен Bootstrap?…14

Глава 2. Придобиване и инсталиране на Bootstrap…17
2.1. Придобиване на Bootstrap…17
2.2. Бърз старт…19
2.3. Bootstrap CDN…22
2.4. Използване на потребителски стилове…26
2.5. Използваме средството за настройка на Bootstrap…28
2.6. Дълбока настройка на Bootstap…32

Глава 3. Системата от решетки на Bootstrap…35
3.1. Какво представлява системата от решетки?…35
3.2. Създаване на базова решетка…36
3.3. Създаване на динамично оформление…43
   3.3.1. Проектиране на оформление за настолен компютър…45
   3.3.2. Проектиране на оформление за таблет…50
   3.3.3. Проектиране на оформление за мобилен телефон…52
3.4. Влагане на колонки…53
3.5. Изместване на колонка…55
3.6. Пренареждане на решетката…56

Глава 4. Използване на базов CSS…58
4.1. Заглавия…59
4.2. Абзаци и изчертаване на текст…63
4.3. Класове за подравняване…64
4.4. Класове за акценти…66
4.5. Адрес на компанията…68
4.6. Цитати…70
4.7. Термини…71
4.8. Списъци…71
4.9. Таблици…72
4.10. Бутони…79
4.11. Форми…81
4.11.1. Обикновена форма…81
4.11.2. Вътрешноредова форма…84
4.11.3. Хоризонтална форма…87
4.12. Форматиране на кода…88
4.13. Изображения…89

Глава 5. Запознаване с основните компоненти на Bootstrap…91
5.1. Компоненти на страницата…91
   5.1.1. Заглавна част на страницата…91
   5.1.2. Панели…93
   5.1.3. Използване на класа Media…95
   5.1.4. Миниатюри…97
   5.1.5. Списъци…101
5.2. Навигационни компоненти…103
   5.2.1. Раздели за навигиране и „таблетки“…104
   5.2.2. Навигационна лента…106
   5.2.3. „Диря от трохи“…112
5.3. Елементи на потребителския интерфейс…113
5.3.1. Етикети…113
   5.3.2. Бутони…113
   5.3.3. Класът Glyphicon…114

Глава 6. Продължаваме запознанството си с компонентите в Bootstap…116
6.1. Компонентът Jumbotron…116
6.2. Компонентът Well…119
6.3. Индикатор за напредъка (ProgressBar)…120
6.4. Пагинация…125
6.5. Група бутони…127
6.6. Бутони с падащо меню…128
6.7. Независими и зависими превключватели в Bootstrap…129
6.8. Известия…131

Глава 7. Плъгини в Bootstrap…134
7.1. Шаблон за тази глава…134
7.2. Изскачащи подсказки…135
7.3. Плъгинът Popovers…137
7.4. Изскачащи прозорци…138
7.5. Плъгинът ScrollSpy…142
7.6. Въртележка – слайдшоу…144

Глава 8. Оптимизация на Bootstrap…149
8.1. Техники за оптимизация…149
   8.1.1. Оптимизация на CSS файлове…150
   8.1.2. Оптимизация на JavaScript кода…152
   8.1.3. Оптимизация на изображения…153
8.2. Типични грешки…156

Глава 9. Теми, шаблони и допълнителни ресурси…158
9.1. Теми и шаблони…158
   9.1.1. Платени шаблони…158
   9.1.2. Безплатни шаблони…161
9.2. Плъгини за Bootstrap…163
9.3. Редактори…164

Глава 10. Реален пример: пишем сайт за блог…167
10.1. Разработка на главната страница…168
10.2. Страничката със записа на блога…176
10.3. Контактна форма…178

Заключение…183