Вёрстка сайтов | HTML, CSS, JS

:indeterminate css

Читать 👨‍💻

#css | #теория

Кратко Псевдокласс, который используется для стилизации трёх элементов: чекбоксов, радиокнопок и прогресс-баров. Пригодится в двух случаях. Во-первых, для стилизации элементов в их исходном состоянии — при открытии формы или начале загрузки. Во-вторых, для…

1.3K views13:27

:optional css

Читать 👨‍💻

#css | #теория

Telegraph

:optional css

Кратко С помощью псевдокласса :optional можно выбрать элементы, заполнять которые необязательно. Это могут быть <input>, <select> и <textarea> без атрибута required. Пример HTML: <form> <label>Имя вашего котика: <input></label> </form> CSS: input:optional…

1.0K views07:05

Вёрстка сайтов | HTML, CSS, JS

CSS-приемов, которые сэкономят вам часы работы

Знаете ли вы, что в CSS есть фичи, которые редко используют, но они могут упростить жизнь? Вот они:

- aspect-ratio – задает соотношение сторон элемента без костылей с padding-top.
- scroll-snap – плавная фиксация скролла, как в мобильных галереях.
- :empty – стилизация пустых блоков (удобно для динамического контента).
- gap во Flexbox – больше не нужны margin-хаки для отступов!
- @supports – проверка поддержки свойств в браузере.

#css | #полезности

1.1K views07:07

Вёрстка сайтов | HTML, CSS, JS

Initial-letter. Буквица в css

Читать 👨‍💻

#css | #теория

Telegraph

initial-letter. Буквица в css

Сегодня мы рассмотрим еще одно новое дополнение к CSS, которое скоро появится в браузерах: initial-letter. Это свойство все еще является экспериментальным с поддержкой в Safari, но оно поддерживается в браузерах Chromium Canary. Иногда это немного глючит…

910 views09:07

Вёрстка сайтов | HTML, CSS, JS

Свойство -webkit-line-clamp

Читать 👨‍💻

#css | #теория

Telegraph

CSS-свойство -webkit-line-clamp

Свойство CSS -webkit-line-clamp позволяет ограничить содержимое блока указанным количеством строк. Плюсы: четкое ограничение пространства под текст, надежность (даже при изменении количества текста отображаться будет установленное количество строк), небольшое…