Пример вёрстки сайта на Bootstrap3
HTML и CSS верстка
Адаптивная вёрстка на Bootstrap3. Меню превращается в гамбургер, но оно не Boot, а самописное.
Многие элементы по умолчанию полупрозрачны, при наведении становятся яркими.
Блок Features с изображением мобильного адаптируется следующим образом: на планшетах надписи слева, а телефон справа, на мобильных устройствах картинка телефона сверху, а всё остальное под ней.
Блок Works при наведении на работу в портфолио получаем получаем полупрозрачное затемнение с изображением глаза, названием проекта и категорией.
Блок Team при наведении на специалиста появляется затемнение с краткой информацией и ссылки-соц сети на его профили для перехода.
Форма обратной связи: если поле заполнено корректно, справа в нём появляется зелёная галочка, некорректно - красный восклицательный знак.
Карта гугла адаптируется под размер экрана, сохраняя пропорции дизайна, при этом для мобильных устройств задана минимальная высота элемента (чтобы карта не была полоской).
Ширина сайта варьируется под экраны от 360px до 1160px
Многие элементы по умолчанию полупрозрачны, при наведении становятся яркими.
Блок Features с изображением мобильного адаптируется следующим образом: на планшетах надписи слева, а телефон справа, на мобильных устройствах картинка телефона сверху, а всё остальное под ней.
Блок Works при наведении на работу в портфолио получаем получаем полупрозрачное затемнение с изображением глаза, названием проекта и категорией.
Блок Team при наведении на специалиста появляется затемнение с краткой информацией и ссылки-соц сети на его профили для перехода.
Форма обратной связи: если поле заполнено корректно, справа в нём появляется зелёная галочка, некорректно - красный восклицательный знак.
Карта гугла адаптируется под размер экрана, сохраняя пропорции дизайна, при этом для мобильных устройств задана минимальная высота элемента (чтобы карта не была полоской).
Ширина сайта варьируется под экраны от 360px до 1160px