← Все инструменты для текста

Калькулятор специфичности CSS

Узнайте, какой CSS-селектор победит, с оценкой каждого селектора (ID, классы, элементы).

  • Бесплатно
  • Без регистрации
  • Работает на любом устройстве

Около Калькулятор специфичности CSS

Вставьте селекторы CSS и увидите специфичность каждого в виде трёх чисел: ID, затем классы, атрибуты и псевдоклассы, затем элементы. Побеждает больший счёт независимо от порядка в исходнике, а при равенстве выигрывает более позднее правило. Встроенные стили сильнее всех селекторов, а !important сильнее и их.

Как пользоваться инструментом «Калькулятор специфичности CSS»

  1. Введите или вставьте один или несколько селекторов CSS, по одному на строку.
  2. Посмотрите оценку для каждого, показанную как ID, классы и элементы.
  3. Сравните оценки, чтобы увидеть, какое правило побеждает.

Чем полезен этот инструмент?

Другие названия

Частые вопросы

Какова специфичность селектора класса?

Один класс считается как 0,1,0. ID — это 1,0,0, а простой элемент вроде div — 0,0,1. Сравнивайте их слева направо, а не как одно десятичное число.

Что происходит, когда у двух селекторов одинаковая специфичность?

Побеждает правило, которое появляется позже в таблице стилей. Поэтому порядок важен только при равных оценках.

Переопределяет ли important специфичность?

Да, объявление с important побеждает обычные независимо от специфичности. Используйте его редко, так как оно затрудняет последующие переопределения.

Инструмент «Калькулятор специфичности CSS» бесплатный?

Да. Инструмент «Калькулятор специфичности CSS» на Toolipedia бесплатный: без регистрации и водяных знаков.

Это безопасно?

Да. Все вычисления выполняются в браузере, и ничего из введённого не отправляется на наш сервер.

Работает ли это на телефоне?

Да. Работает в любом современном браузере на Android и iPhone, а также на планшетах и компьютерах. Ничего не нужно устанавливать.

Нужна ли учётная запись?

Нет. Просто откройте страницу и пользуйтесь. Ни регистрации, ни электронной почты не нужно.

Можно ли разместить Калькулятор специфичности CSS на моём сайте?

Да. Нажмите кнопку «Встроить на свой сайт» под инструментом, чтобы скопировать короткий фрагмент кода и вставить его на страницу. Это бесплатно, аккаунт не нужен, и инструмент продолжает работать внутри вашей страницы.

Похожие инструменты