Статьи по css

Материалы по css

RSS для CSS
Страницы:

Выравниваем div по-центру другого div в меню Bootstrap

По-умолчанию navbar показывает пункты меню с выравниванием по левому краю. Но обычно там же в левом углу у людей есть логотип сайта. И иногда меню очень хочется отстранить по-правее от логотипа. Вот как просто это сделать.
 

Нет картинки

На одностраничных лендингах красиво сделать плавный переезд при нажатии на пункт меню. Вот как просто это делается в Bootstrap
 

Выдвигающаяся из значка форма поиска на сайте

Бывает форму поиска негде впихнуть в дизайне шапки сайта. Нужно выделить поле для ввода запроса поиска, но если этим поиском не часто пользуются, то хочется сэкономить место. Хорошим решением будет, не убирать совсем форму поиска, а оставить иконку значка поиска, при клике по которой выдвигается всё поле для введения запроса.
 

Нет картинки

При вёрстке требуется часто выравнять блок div по горизонтали посередине внутри другого div.
 

Нет картинки

В каких-нибудь готовых css фреймворках бывают непонятные неожиданности. Меняешь дизайн, а отступы не убираются, и всё вроде проверил, а всё равно отступ остаётся
 

Нет картинки

placeholder - это атрибут в html5, который выводит текст внутри поля input, и этот текст исчезает, когда пользователь начинает там писать свой текст. Это нужно, например, в форме поиска, чтобы убрать текст подсказки внутри неё при клике по ней.
 

Выравнивание изображения по центру в Bootstrap

Как выровнять картинку посередине в Bootstrap.
 

Замена текста при наведении на него мышью. События onmouseover и onmouseout

Делаем подмену текста при наведении мышью.
 

Прилипание блока к верху сайта при его прокручивании

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

Как сделать какую-либо область на сайте кликабельной ссылкой?

Логотип оказался на самом изображении в хедере сайта. Сделать весь верх ссылкой на главную страницу как-то неправильно. Текст тоже особо не впишется. Делаем просто область поверх хедера, которая наслаивается на то место, где представлен логотип на основной большой картинке в шапке. 
Страницы: