Chrome 120 beta
Новые 7 фич для CSS. Улучшения для nesting (вложенности стилей). Создание «аккордиона» для через элемент details и многое другое.
Новые 7 фич для CSS. Улучшения для nesting (вложенности стилей). Создание «аккордиона» для через элемент details и многое другое.
Синтаксис <Image> добавлен в поддержку для своих кастомных свойств @property или registerProperty() и может использоваться для url() картинок или градиентов.
<transform-function>
and <transform-list>
для кастомных свойствСинтаксис <transform-function>
and <transform-list>
добавлен в поддержку для своих кастомных свойств @property или registerProperty(). Позволяет использовать переходы и анимации в этих пользовательских свойствах.
Позволяет определять для JavaScript некоторые условия
@media (scripting: none) {
.script-none {
...
}
}
@media (scripting: initial-only) {
.script-initial-only {
...
}
}
@media (scripting: enabled) {
.script-enabled {
...
}
}
Псевдоэлемент позволяет применить стили для текстов которые имеют направленность «ltr или rtl»
:dir(ltr) {
background-color: red;
}
:dir(rtl) {
background-color: blue;
}
Из спецификации CSS Values and Units Level 4 доступны функции pow(), sqrt(), hypot(), log() и exp(). Как можно применить на примере базовых размеров для заголовков:
:root {
--h6: calc(1rem * pow(1.5, -1));
--h5: calc(1rem * pow(1.5, 0));
--h4: calc(1rem * pow(1.5, 1));
--h3: calc(1rem * pow(1.5, 2));
--h2: calc(1rem * pow(1.5, 3));
--h1: calc(1rem * pow(1.5, 4));
}
Свойства mask-image and mask-mode позволит обрезать изображение или фон под изображения в разных модах. Также можно использовать и для текста. Примеры на css-tricks:
Пример на градиенте и SVG картинки:
Вложенный уровень больше не начинается с символа &. Теперь валидный пример:
.card {
h1 {
/* Это валидно! */
}
}
/* Тоже самое */
.card {
& h1 {
/* Это валидно сейчас */
}
}
В HTML немного фич, с помощью нескольких тегов<details> теперь можно сделать аккордион. Если они имеют одно имя, то они образуют группу и можно без JS сделать полезный активный элемент. Важный момент, что активный details может быть открыт только один.
К API FontFaceSet добавили метод check который позволит узнать возможность использования указанных шрифтов.
Новая концепция и включает в себя запросы пользователей на закрытие через Esc или свайпом назад в Android.
Новый API, помогающий пользователям и разработчикам лучше понимать процесс аунтификации. Лучше всего объяснит, отдельный пост — https://developer.chrome.com/blog/fedcm-chrome-120-updates/
Остальные более низкоуровневые и не очень важные нововведения смотрите на официальном сайте https://developer.chrome.com/blog/chrome-120-beta/#fenced-frames-functionality-updates
В Deno добавили очередь cron, Релиз 2023.3 Webstorm с AI ассистентом, Storybook последняя версия 7.6 перед 8, и бета Node.js 20
Компания Mozilla представила обновлённую версию своего популярного браузера — Firefox 134. Новый релиз принёс множество улучшений, которые порадуют как обычных пользователей, так и разработчиков, уделяя особое внимание удобству и производительности. Интуитивные жесты и видеопроизводительность Одним из главных новшеств стало добавление поддержки жестов с удержанием на тачпаде для пользователей Linux. Теперь можно легко прерывать кинетическую прокрутку, […]
Рассказываем о некоторых новостях в октябре в Java, среди них JDK 22, BellSoft, Oracle, GraalVM, Open Liberty.
Недавно в Node.js была добавлена экспериментальная возможность выполнения файлов на TypeScript. Эта новая опция активируется с помощью флага —experimental-strip-types, что означает, что Node.js будет транслировать исходный код TypeScript в JavaScript перед выполнением.