HTML и CSS

SASS что это?

SASS что это?

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

Чем отличаются элементы типа block, inline и inline-block

Чем отличаются элементы типа block, inline и inline-block?

В этом уроке мы с вами поговорим про самую базовую, но в то же время очень важную тему, посвященную разбору трех основных типов элементов, которые есть в HTML, это такие типы, как block, inline и inline-block. Здесь мы разберем отличие каждого типа друг от друга.

Удаляем пустое пространство между inline-block элементами

Удаляем пустое пространство между inline-block элементами

При использовании inline-block элементов, все верстальщики зачастую встречают такую проблему, что между этими самыми элементами появляется какой-то непонятный отступ, с которым нужно как-то бороться. Большинство новичков даже не представляют, откуда этот отступ вообще берется, поэтому я решил написать статью, в которой постараюсь все рассказать более детально.

Меню со "скользящей" линией

Меню со «скользящей» линией

В данном уроке мы научимся делать меню с двигающейся линией при наведении. Такое меню часто называют Magic Line или Sliding Line.

Стилизация Input File

Стилизация Input File

Есть куча способов изменить стандартное оформление Input File, но к сожалению, многие из них оказываются слишком громоздкими и зачастую не кроссбраузерными. Поэтому я решил поделиться с вами, наиболее оптимальным решением.

Masonry

Masonry — вывод блоков в виде кирпичной кладки

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

animate.css

Animate.css в примерах

В данном уроке мы с вами познакомимся с очень интересным инструментом под названием animate.css. Это уже готовая CSS таблица стилей, которая в своем арсенале имеет свыше 50 различных эффектов и все эти эффекты реализованы на CSS3.

Полосатая таблица

Полосатая таблица

Очень часто, верстая таблицы, их приходится делать в виде «полосатых таблиц» — это когда цвет рядов чередуется друг за другом. Данный подход помогает представить табличный контент в более читабельном и наглядном виде. В данной статье мы научимся создавать такие таблицы.

Прижать футер к низу экрана

Как прижать футер к низу страницы

В этом уроке мы с вами поговорим, как сделать «липкий» подвал (футер) на сайте. Сделав такой футер, мы заставим его прижиматься к нижней границы окна браузера и таким образом, футер не будет подниматься вверх, если контента на странице слишком мало. Если же контента на странице много, то «липкий» футер будет себя вести, как обычно.

Clerafix

Clearfix на CSS

При использовании свойства float, многие новички сталкиваются с целым рядом проблем. В основном эти проблемы вызваны непониманием принципа работы свойства float и способа отмены обтекания, которое возникаем в результате применения данного свойства.

Наверх

Скачивание материалов доступно
только подписчикам!

Если вы подпишитесь, то сможете сразу же получить доступ ко всем материалам этого блога

Подписка бесплатная и займет у вас
не более 1 минуты

Получение доступа к материалам

Для получения доступа, заполните форму ниже. Введите свое настоящее имя и e-mail

« Вернуться назад

Проверьте свой почтовый ящик

и подтвердите подписку

После этого вы сразу же получите доступ ко всем материалам этого блога

Введите e-mail, который вы указывали при подписке

Мы проверим его по базе подписчиков и если вы на самом деле подписывались, то доступ для вас сново будет открыт

« Вернуться назад