HTML, CSS, JS

Формы в Bootstrap. Часть 1

Рис.1. Пример вертикальной формы

Фреймворк Bootstrap содержит средства оформления не только кнопок, но и форм. Это касается таких элементов управления как <select>, <input>, <textarea>. Read more»

HTML, CSS, JS

Верстка страниц сайтов в Bootstrap блоками

Bootstrap logo

Основное преимущество от использование Bootstrap – сокращение времени на верстку и разработку. Фреймворк Bootstrap основан на использовании блочной верстки для создания адаптивных страниц – страниц, внешний вид которых подстраивается автоматически под разрешение устройства пользователя. Read more»

HTML, CSS, JS

Оформление таблиц в фреймворке Bootstrap

Рис.2. Таблица в стиле Bootstrap по умолчанию

В Bootstrap встроена возможность стильного оформления таблиц. К сожалению, таблицы по умолчанию выглядят не просто аскетично, а на них вообще неприятно смотреть – отсутствуют отступы в ячейках, рамки, если отображаются, то просто убогие. Потому веб-мастеру уже нужно помнить, что стили таблиц нужно переопределять. Bootstrap об этом тоже помнит и уже содержит заготовленный класс для таблиц. Read more»

HTML, CSS, JS

Основы использования фреймворка Bootstrap

Bootstrap logo

В первое время после отказа от табличной верстки было немного непривычно переходить на блочную верстку. Тогда, да и сейчас, мне казалось, что она многое усложнила. И так оно было до появления фреймворков, которые очень сильно упростили верстку. Речь идет о фреймворках для так называемой адаптивной верстки. Наиболее популярные среди их это Foundation и Bootstrap. В отличие […] Read more»

HTML, CSS, JS

Табы (вкладки) на страницах сайта с помощью CSS и jQuery

Рис.4. Табы (вкладки) с помощью CSS и jQueriUI

Табы, или вкладки – это очень удобный инструмент для страниц. Использование табов позволяет разместить больше информации в видимом месте и дать посетителю сайта право переключаться для доступа к нужной информации без перезагрузки страницы. Довольно простой способ реализовать табы на странице – с помощью расширения для jQueri – jQueryUI. Read more»

HTML, CSS, JS Javascript

Фон в полоску с помощью CSS

Фон в полоску с помощью CSS

С помощью CSS можно создать интересные текстуры без использования графики с помощью свойства linear-gradient. Если лет 10 назад нужно было рисовать картинку и делать ее фоном, то теперь намного проще. Read more»

HTML, CSS, JS

Растянуть на полный экран фоновое изображение с помощью CSS

Рис.1. Фото для фонового изображения

При создании сайтов хочется даже фоном подчеркнуть тематическую направленность сайта, вставив в фон красивое изображение. При использовании фото в качестве фона, заставить изображение растягиваться без искажений довольно непросто, особенно если вы все еще заботитесь о пользователях немного устаревших браузеров. Read more»

HTML, CSS, JS

Зафиксировать HTML элемент на экране с помощью CSS

На длинных HTML страницах бывает удобно, чтобы HTML элемент, например, кнопка, ведущая на верх страницы, или меню, были расположена в определенной части экрана. Именно экрана, а не страницы. Ну и кнопка должны быть выше остальных элементов. Read more»

HTML, CSS, JS

Популярные записи