Стилизуем слайдер input range для всех популярных браузеров

Стилизуем слайдер input range для всех популярных браузеров

https://toughengineer.github.io/demo/slider-styler (смотреть лучше на десктопе) Работает со всеми популярными браузерами. Читать далее

Подробнее
Счёт может быть красивым и в HTML, а не в PDF

Счёт может быть красивым и в HTML, а не в PDF

В статье “Что должно быть в счёте на оплату, чего быть не должно и что дико бесит” мы разбирали содержимое счёта. По результатам той работы возникло желание оформить счёт стильно ибо стандартный вариант бухгалтерских программ вроде 1С какой-то страшный. В статье разберём плюсы генерации счетов в HTML-формате по сравнению с генерацией PDF и тюнинг версии для печати, добавим 5 копеек про ЭЦП (УКЭП). Итак, погнали...

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

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

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

Подробнее
Новые форматы графики в CSS с помощью обновлённой функции image-set

Новые форматы графики в CSS с помощью обновлённой функции image-set

CSS функция image-set поддерживается в браузерах на основе Chromium с 2012 года, а в Safari начиная с версии 6. Недавно поддержка появилась в Firefox 88. Давайте углубимся в эту тему и посмотрим, что мы можем и чего не можем делать с помощью функции image-set () Читать далее

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

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

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

Подробнее
[Перевод] Полное визуальное руководство/шпаргалка по CSS Grid

[Перевод] Полное визуальное руководство/шпаргалка по CSS Grid

Сегодня мы с вами рассмотрим свойства CSS Grid (далее также — Грид), позволяющие создавать адаптивные или отзывчивые макеты веб-страниц. Я постараюсь кратко, но полно объяснить, как работает каждое свойство. Что такое CSS Grid? Грид — это макет для сайта (его схема, проект). Грид-модель позволяет размещать контент сайта (располагать его определенным образом, позиционировать). Она позволяет создавать структуры, необходимые для обеспечения отзывчивости сайтов на различных…

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

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

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

Подробнее
[Перевод] DIV должен уйти: улучшаем HTML

[Перевод] DIV должен уйти: улучшаем HTML

Во многих домах есть комната, существующая только потому, что вокруг неё возвели четыре стены, и теперь ей нужно какое-то предназначение. В результате такие «комнаты-заглушки» используются чаще, чем все остальные комнаты дома, хоть изначально они для этого и не предназначались. Их универсальность и уникальность позволяют нам часто их изменять, не ограничиваться их целью и ощущать свободу их планировки. Тег div во многом напоминает такие комнаты. Он является чистым листом. Он подходит для…

Подробнее
<img>. Доклад Яндекса

<img>. Доклад Яндекса

«Просто добавь картинку на сайт», — говорили они. А оказалось, что «просто» не значит «правильно». В докладе я постарался разобраться, как эффективно добавлять изображения на страницу, какие форматы графики для каких случаев полезны и как автоматизировать автоматизируемое. — Всем привет. У меня доклад с интригующим названием в виде одного тега. Читать дальше →

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

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

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

Подробнее
Заметка о вариантах организации Sass/SCSS в Angular приложении

Заметка о вариантах организации Sass/SCSS в Angular приложении

Как структурировать sass/scss файлы в проекте Angular? Однажды задавшись этим вопросом, нашел несколько вариантов. Читать далее

Подробнее
Мои 3 совета про Flexbox, которые улучшат ваш CSS

Мои 3 совета про Flexbox, которые улучшат ваш CSS

Когда я делаю ревью CSS, то часто сталкиваюсь с некоторыми ошибками, которые связаны с Flexbox. В этой статье я хочу поделиться ими, чтобы вы больше их не делали. Читать далее

Подробнее