[Перевод] CSS: полное руководство по функции calc()

Скрипты и советы | 23 марта 2020 1 517

Уроки CSS на Хабрахабре, habrahabr.ru, Блог компании RUVDS.com, Разработка веб-сайтов, CSS, разработка,

В CSS есть особая функция calc(), применяемая для выполнения простых вычислений. Вот пример её использования:

.main-content {  /* Вычесть 80px из 100vh */  height: calc(100vh - 80px);}

Здесь с CSS-кодом, в котором используется calc(), можно поэкспериментировать.



Автор статьи, перевод которой мы сегодня публикуем, хочет рассказать обо всём, что стоит знать об этой весьма полезной функции.
Читать дальше →

Источник: Уроки CSS на Хабрахабре

[Перевод] Математика разметки с помощью CSS: разбираемся с calc

За последние годы верстка в интернете развилась из фиксированных дизайнов к адаптивным. Причем, в стилях могут...

Подробнее
[Перевод] CraSSh: ломаем все современные браузеры вычислениями в CSS

Автор статьи: Константин Сафонов Не хочу читать эту техническую болтовню. Просто повали уже мой браузер. Что такое...

Подробнее
[Перевод] Готовимся к собеседованию по фронтенду: 15 вопросов

Автор статьи, перевод которой мы сегодня публикуем, приводит 15 вопросов, которые задавали на собеседованиях ему, и...

Подробнее
[Перевод] Полное руководство по HTML-атрибутам data-*

Представляем вашему вниманию перевод статьи, посвящённой использованию атрибутов data-*. Это — атрибуты, которые можно...

Подробнее
[Перевод] Atomic CSS здорового человека

Перевод статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu, автора UnoCSS,...

Подробнее
Вышел плагин CFI v.2.0.0 — экспорт/импорт материалов Joomla в таблицы

Первые версии плагина CFI создал разработчик AlekVolsk для Joomline. Он создал версии 1.0.0-1.0.16 для Joomla 3. Затем,...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями