Вёрстка сайтов | HTML, CSS, JS
@free_html_lessons
4.78K subscribers
653 photos
1 video
4 files
1.1K links
👋 Привет, друг!

В этом канале я выкладываю структурированные, обучающие уроки и материалы по вёрстке сайтов и фронтенду.
Присоединяйся и начинай учиться!

Связь: @Tigran1963
Download Telegram
About
Blog
Apps
Platform
Join
Вёрстка сайтов | HTML, CSS, JS
4.78K subscribers
Вёрстка сайтов | HTML, CSS, JS
Примеры использования nth-child

Смотреть на codepen 👨‍💻

#css | #полезности
👍1
1.13K views
Вёрстка сайтов | HTML, CSS, JS
Как работают @container queries?

Читать 🧑‍💻

#css | #теория
❤4👍2
1.18K views
Вёрстка сайтов | HTML, CSS, JS
CSS Custom Properties: глубокий разбор переменных

Читать 🧑‍💻

#css | #полезности
👍5
1.26K views
Вёрстка сайтов | HTML, CSS, JS
:indeterminate css

Читать 👨‍💻

#css | #теория
Telegraph
:indeterminate css
Кратко Псевдокласс, который используется для стилизации трёх элементов: чекбоксов, радиокнопок и прогресс-баров. Пригодится в двух случаях. Во-первых, для стилизации элементов в их исходном состоянии — при открытии формы или начале загрузки. Во-вторых, для…
👍4
1.31K views
Вёрстка сайтов | HTML, CSS, JS
:optional css

Читать 👨‍💻

#css | #теория
Telegraph
:optional css
Кратко С помощью псевдокласса :optional можно выбрать элементы, заполнять которые необязательно. Это могут быть <input>, <select> и <textarea> без атрибута required. Пример HTML: <form> <label>Имя вашего котика: <input></label> </form> CSS: input:optional…
👍2
1.04K views
Вёрстка сайтов | HTML, CSS, JS
CSS-приемов, которые сэкономят вам часы работы

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

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

#css | #полезности
👍9
1.1K views
Вёрстка сайтов | HTML, CSS, JS
Initial-letter. Буквица в css

Читать 👨‍💻

#css | #теория
Telegraph
initial-letter. Буквица в css
Сегодня мы рассмотрим еще одно новое дополнение к CSS, которое скоро появится в браузерах: initial-letter. Это свойство все еще является экспериментальным с поддержкой в Safari, но оно поддерживается в браузерах Chromium Canary. Иногда это немного глючит…
👍3
959 views
Вёрстка сайтов | HTML, CSS, JS
Свойство -webkit-line-clamp

Читать 👨‍💻

#css | #теория
Telegraph
CSS-свойство -webkit-line-clamp
Свойство CSS -webkit-line-clamp позволяет ограничить содержимое блока указанным количеством строк. Плюсы: четкое ограничение пространства под текст, надежность (даже при изменении количества текста отображаться будет установленное количество строк), небольшое…
👍4❤1
996 views
Вёрстка сайтов | HTML, CSS, JS
CSS-функция clamp()

Читать 👨‍💻

#css | #полезности
Telegraph
CSS-функция clamp()
Функция clamp() Функция clamp() позволяет ограничивать диапазон изменения некоего значения, задавая его нижний и верхний пределы. Она принимает три параметра: минимальное значение, вычисляемое (рекомендованное) значение, максимальное значение. Если вычисляемое…
👍3
1.1K views
Вёрстка сайтов | HTML, CSS, JS
Влияние CSS на доступность

Читать 👨‍💻

#css | #теория
Telegraph
Влияние CSS на доступность
Кратко Скопировать ссылку на секцию "Кратко" Мы привыкли, что в структуре сайта CSS отвечает только за визуальное представление, а всё касающееся контента задаётся в HTML. Однако, это не совсем так. В CSS есть свойства, способные как улучшить восприятие вашего…
👍3
1.17K views