TGViewer
JavaScript for Devs JavaScript for Devs @js_for_devs · 491 subscribers
Post #55 629
🔥 Обзор новых возможностей CSS в Safari 26

Safari 26 вышел, и это одно из самых содержательных обновлений WebKit за последние годы.

В релизе — 75 новых возможностей и 171 улучшение. Многие фичи уже были в Chrome, но теперь они становятся доступными и в Safari, что важно для кросс-браузерного использования.

Главные изменения в части CSS:

• Anchor positioning. Теперь Safari поддерживает привязку абсолютно позиционированных элементов к другим узлам. Это делает возможным реализацию тултипов и попапов на чистом CSS.

• Scroll-linked animations. Появились animation-timeline с функциями scroll() и view(), а также animation-range. Анимации можно привязывать к прокрутке или к появлению элемента во вьюпорте — без JS.

• progress(). Новая функция, которая вычисляет прогресс в диапазоне и умеет работать со смешанными единицами измерения (px + vw и т.п.). Упрощает сценарии, которые раньше приходилось собирать через calc() или тригонометрию.

• Самовыравнивание при absolute. В absolute-контейнерах теперь можно использовать align-self и justify-self (включая anchor-center). Это решает часть типичных задач центрирования без translate-хаков.

• contrast-color(). Функция автоматически выбирает чёрный или белый текст для заданного фона. Реализация пока ограниченная, но впервые доступна в стабильном релизе Safari.

• text-wrap: pretty. Улучшает разбиение текста на строки: уменьшает количество коротких строк и сглаживает «рваный» край. Safari идёт дальше текущей реализации Chrome.


Это только часть изменений. Полный разбор со множеством демо — в статье.

@js_for_devs
  • ❤ 3
  • 👍 3
  • 🔥 3
  • 😁 1
More from @js_for_devs
  1. Sep 30, 2026Тут больше не будет новостей, статей и постов про JavaScript/TypeScript. JS/TS-разработчик…
  2. Feb 10, 2026Развлекался на выходных со Skills от Remotion. В итоге получился этот промо-ролик. В Remot…
  3. Jan 21, 2026Наконец-то могу видеть свои tailwind-классы без бесконечного скролла..
  4. Jan 20, 2026🔥 Почему свой игровой движок — это проще, чем кажется В новой, большой и практической ста…
  5. Jan 12, 2026⚙️ Инструменты для JavaScript больше не пишут на JavaScript — и вот почему это осознанный…
  6. Dec 29, 2025🎄 Итоги года 4Devs 2025 На прошлой неделе Habr опубликовал итоги года — и наш проект попа…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →