← Все вопросы

Написал стиль, а он не применяется к элементу. Как искать причину?

Задан 31 месяц назад1.1к просмотров2 ответа
7

Добавил классу цвет, сохранил, обновил страницу — а ничего не поменялось. Код вроде правильный. Куда вообще смотреть, когда стиль «не работает»?

2 ответа

11
✓ Принятый ответ — помог автору

Это классическая беда новичка, причин обычно несколько — пройдись по чеклисту:

  1. Опечатка в имени класса. В HTML class="card", а в CSS .crad — не совпало. Проверь буква в букву.
  2. Забыл точку/решётку. Для класса в CSS нужна точка (.card), для id — решётка (#card). Без них браузер ищет тег card.
  3. CSS не подключён. Если стили в отдельном файле, проверь <link rel="stylesheet" href="style.css"> в <head> и путь к файлу.
  4. Кеш браузера. Нажми Ctrl+F5 (жёсткое обновление), иногда грузится старая версия.
  5. Перебивает другой стиль. Где-то ниже/специфичнее задано то же свойство.

Главный инструмент — DevTools (F12), вкладка Elements: кликни на элемент и посмотри, какие стили к нему реально применились и не зачёркнуто ли твоё правило.

5

Если в DevTools видно, что твой стиль есть, но зачёркнут — значит его перебил более «сильный» селектор (специфичность) или правило, идущее ниже по коду. Тогда либо сделай селектор точнее, либо проверь порядок. До !important лучше не доходить — это костыль.

Ваш ответ

Войдите, чтобы ответить на вопрос.