Главная Случайная страница


Полезное:

Как сделать разговор полезным и приятным Как сделать объемную звезду своими руками Как сделать то, что делать не хочется? Как сделать погремушку Как сделать неотразимый комплимент Как сделать так чтобы женщины сами знакомились с вами Как сделать идею коммерческой Как сделать хорошую растяжку ног? Как сделать наш разум здоровым? Как сделать, чтобы люди обманывали меньше Вопрос 4. Как сделать так, чтобы вас уважали и ценили? Как сделать лучше себе и другим людям Как сделать свидание интересным?


Категории:

АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника






Создание шапки





Доверь свою работу кандидату наук!
Поможем с курсовой, контрольной, дипломной, рефератом, отчетом по практике, научно-исследовательской и любой другой работой

Для вёрстки шаблона нам потребуется бесплатная программа Notepad++ и необходимо установить плагин в браузер выбирающий цвета в шестнадцатеричном формате или в формате RGB.

В вёрстке шаблона используется адаптивная сетка bootstrap – все ячейки содержимого помещаются в блоки, строка это такой же блок ,к которому присваивается класс row . Для задания отступа между строками обрамляются общим контейнером данному контейнеру присваивается класс container, каждый блок в строке уже является контейнером, в таком блоке можно создавать вложенные строки с блоками к которым применяются такие же классы как для родительского.

Наш шаблон разделён на несколько строк, в каждой из которой есть блоки, все строки лежат в общем внешнем контейнере имеющим определённую ширину. Шапка шаблона состоит из трёх блоков равной ширины. Задача адаптировать строки нашего шаблона под разные размеры экранов и задать классы для блоков в каждой строке. Для блоков сетки bootstrap есть четыре класса для разных размеров экрана (col – xs – , col – sm – , col – md – , col – lg – ). Классы создают минимальную ширину для блока. Шапка шаблона адаптивна так же и для мобильных телефонов с шириной экрана менее 768 px. Шапка будет занимать всю ширину экрана телефона, поэтому блоку присвоим классы с префиксом col – xs – .

Для создания шапки шаблона мы обратимся к схематичному рисунку шаблона.

Рисунок 4 – Схематичный рисунок шаблона.

В неё входят три позиции логотип, контакты, поиск (Рисунок 6).

Рисунок 5 – Вёрстка шапки в Notepad++

Рисунок 6 – Отображение шапки в браузере







Date: 2015-10-18; view: 282; Нарушение авторских прав



mydocx.ru - 2015-2022 year. (0.015 sec.) Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав - Пожаловаться на публикацию