[Перевод] [ В закладки ] CSS: использование внутренних и внешних отступов

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

читать далее

[Перевод] Интересные CSS-находки в новом дизайне Facebook

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

читать далее

[Перевод] LCH-цвета в CSS

Меня всегда интересовала наука о цвете. В 2014 году я выступала на разных конференциях, рассказывая о спецификации CSS Color 4. А до этого, в 2009 году, я написала программу для выбора цвета. Она

читать далее

[Перевод] Всё о ключевом слове auto в CSS

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

читать далее

[Перевод] CSS: полное руководство по функции calc()

В CSS есть особая функция calc(), применяемая для выполнения простых вычислений. Вот пример её использования: .main-content { /* Вычесть 80px из 100vh */ height: calc(100vh - 80px);} Здесь с

читать далее

[Перевод] CSS: приключения в стране полупрозрачности

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

читать далее

[Перевод] CSS Grid: Верстаем адаптивный журнальный макет в 20 строк

Недавно я работал над современной реализацией блогролла (перечня внешних полезных/интересных блогов). Замысел был в том, чтобы предоставить читателям подборку из последних постов в этих блогах,

читать далее

[Перевод] Чистый CSS: 4 метода анимирования цвета ссылок

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

читать далее

[Перевод] Что делать, когда CSS блокирует парсинг страницы?

Недавно я проводил аудит одного сайта и наткнулся на паттерн preload/polyfill, который уже видел у нескольких клиентов. В наши дни использование этого паттерна, ранее популярного, не рекомендуется.

читать далее

[Перевод] Полное руководство по HTML-атрибутам data-*

Представляем вашему вниманию перевод статьи, посвящённой использованию атрибутов data-*. Это — атрибуты, которые можно применять для удобного хранения в стандартных HTML-элементах различной полезной

читать далее

[Перевод] Стилизация старого доброго элемента button

Кнопка — это один из тех элементов, которые чаще всего используются на веб-страницах. Тег может быть применён для запуска некоего процесса вроде вывода данных, открытия модального окна, отправки

читать далее

[Перевод] Методы скрытия элементов веб-страниц

Веб-разработчикам приходится скрывать элементы веб-страниц по самым разным причинам. Например, есть кнопка, которая должна быть видимой при просмотре сайта на мобильном устройстве, и скрытой — при

читать далее