YeaHub Tech on Telegram: “#Frontend 💻 CSS наконец-то становится языком пр…”

#Frontend

💻 CSS наконец-то становится языком программирования!

В Chrome 137 появилась долгожданная функция if() в CSS — теперь можно писать условную логику прямо в стилях!

Как это работает:

div {
  color: var(--color);
  background-color: if(
    style(--color: white): black;
    else: pink
  );
}

.dark { --color: black; }
.light { --color: white; }

Что это даёт:

• Условные стили без JavaScript
• Адаптивный дизайн на новом уровне
• Динамические темы через CSS-переменные
• Работа с HTML-атрибутами для стилизации

🔖Пример с атрибутами:

.card {
  border-color: if(
    style(--status: error): red;
    style(--status: success): green;
    else: gray
  );
}

<div class="card" style="--status: error">Ошибка</div>
<div class="card" style="--status: success">Успех</div>

💡 Пока что:

- Только Chrome 137+
- Другие браузеры в разработке
- Можно тестировать в Chrome Canary с флагом

📎 Статья

🎙 Новости

📝 База вопросов