Расширенное использование attr() в CSS
Теперь можно брать значения из атрибутов HTML, имеющих типы, так что если в элемент поместить атрибутdata-font-size="2.2rem"
, то его значение можно присвоить.Заметки о Frontend, Backend и немного DevOps. В основном о PHP, Laravel, JavaScript, CSS, тестировании кода и настройке серверов.
data-font-size="2.2rem"
, то его значение можно присвоить.::selection
— это круто, но использование селекторов типа :nth-child(5n+2)
— это гораздо интереснее.String.localeCompare
одним экземпляром Intl.Collator
для более быстрого и эффективного сравнения.currentColor
? Не совсем, лучше использовать CSS переменные. Однако он всё равно имеет свою ценность, и об этом стоит поговорить..:is()
, и он превосходен! Хочу рассказать, как с его помощью можно значительно уменьшить сложность селекторов.light-dark()
для реализации светлого и тёмного режима для SVG иконок,включая SVG, используемые с HTML элементом img
или в качестве CSS свойства background-image
.Intl.DateTimeFormat
для отображения локализированного времени..gif
.:has(:not)
и :not(:has)
, а также то, как подходить к декодированию CSS селекторов, использующих эти вложенные CSS функции.attr()
позволяет извлечь значение атрибута выбранного HTML элемента и использовать его в качестве значения CSS свойства.&
— мощное дополнение к CSS, позволяющее создавать селекторы без повторений и способствующее улучшению организованности и понимания кода.