[Перевод] Выявление устройств с сенсорными экранами на чистом CSS

[Перевод] Выявление устройств с сенсорными экранами на чистом CSS

У разработчиков, которым нужно выявлять устройства с сенсорными экранами, пользуясь исключительно CSS, появилась, благодаря новым возможностям CSS, надежда на светлое будущее. Речь идёт о черновике стандарта CSS Media Queries Level 4, в котором описаны два новых свойства — hover и pointer. Читать дальше →

Подробнее
Венец эволюции CSS-in-JS уже здесь: полностью типизированные стили без рантайма в vanilla-extract

Венец эволюции CSS-in-JS уже здесь: полностью типизированные стили без рантайма в vanilla-extract

После взлёта тайпскрипта (извини, flow) нетипизированные области фронтенда стали мозолить глаза гораздо сильнее. Логика уже давно на TS, вёрстка, при необходимости, на TSX, а вот у CSS ситуация посложнее. Можешь использовать CSS файлы (с диалектами и модулями по вкусу) и указывать классы в вёрстке руками - но типизация здесь на уровне "препроцессор может сгенерировать тайпинги со списком классов прямо в рабочем дереве", да и в общем интеграция с рантаймом никакая. При этом гибкость

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №466 (3 — 9 мая 2021)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №466 (3 — 9 мая 2021)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №465 (26 — 2 мая 2021)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №465 (26 — 2 мая 2021)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
[Перевод] Примеры применения переменных CSS на практике

[Перевод] Примеры применения переменных CSS на практике

Когда я впервые попробовал использовать переменные CSS, у меня не было полного представления об их возможностях. Правильное их использование позволяет существенно сократить время и трудозатраты на решение определённых задач в CSS. Приятного чтения

Подробнее
[Перевод] HTMHell — адовая разметка

[Перевод] HTMHell — адовая разметка

Перевод заметок с сайта HTMHell - коллекции плохих примеров HTML-кода, взятых из реальных проектов. Каждая заметка включает сам фрагмент плохого кода, который дополняется объяснениями, в чём именно ошибки и почему так лучше не делать. А в заключение предлагается вариант, который считается более корректным. Читать далее

Подробнее
[Перевод] Контейнерные запросы в CSS

[Перевод] Контейнерные запросы в CSS

Как фронтенд-дизайнер я за последние 6 лет не был так взволнован новой CSS-функцией, как сейчас. Благодаря усилиям Мириам Сюзанны и других умных людей прототип контейнерных запросов можно включить в Chrome Canary О контейнерных запросах запомнилось много шуток, но они, наконец, здесь. В этой статье я расскажу, зачем нам нужны контейнерные запросы, как они облегчат нашу жизнь, и, самое важное, ваши компоненты и макеты станут мощнее. Если вы взволновались так же, как и я, давайте углубимся

Подробнее
[Перевод] Как обеспечить глассморфизм с помощью HTML и CSS

[Перевод] Как обеспечить глассморфизм с помощью HTML и CSS

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

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №464 (19 — 25 апреля 2021)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №464 (19 — 25 апреля 2021)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
От студента до учителя: как разобраться в веб-разработке, если это не твой профиль

От студента до учителя: как разобраться в веб-разработке, если это не твой профиль

Хоть кому-то и может показаться, что веб-разработчик — это суровый технарь (айтишник же!), вход в эту профессию не сложнее, чем в Python . В неё часто переходят бывшие педагоги, юристы, бухгалтеры и другие гуманитарии. О том, с чего начать обучение, какие ошибки допускают новички, как освоиться в профессии и стоит ли самостоятельно учиться, рассказывает преподаватель веб-разработки в GeekBrains Алексей Кадочников. Читать далее

Подробнее
Полное руководство по CSS Flex + опыт использования

Полное руководство по CSS Flex + опыт использования

Как и CSS Grid, Flex Box довольно сложен, потому что состоит из двух составляющих: контейнера и элементов внутри него. Когда я начал изучать Flex, я хотел увидеть все, на что он способен. Но мне не удалось найти подробное руководство с примерами всех возможностей. Поэтому я решил самостоятельно создать диаграммы свойств Flex с «высоты птичьего полета». Читать!

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №463 (12 — 18 апреля 2021)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №463 (12 — 18 апреля 2021)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее