CSS: сбросить стили, определенные в неприкасаемой таблице стилей

Question

Мне нужна простая <hr/> на странице, которая расширяет страницу по умолчанию (я использую каркас шаблона Django);на этой странице по умолчанию - стандартная и неприкасаемая таблица стилей HR с border:none; height:1px, но я хотел бы сбросить эти стили до значений по умолчанию.

Я пытался поместить {border:1px inset; height:auto;} на своей странице, но не получилтот же аспект, что и отсутствие стиля вообще.

Есть ли способ восстановить стиль по умолчанию для тега?

Answer 1

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

Например, если правило таково:

 hr {
   /* rules */
 }

Тогда вам нужно будет сделать что-то вроде этого:

html hr {
  /* your rules */
}

Результаты рассчитываются по следующим основным правилам:

• элементы, такие как div стоят одного очка
• классы, такие как .comment, стоят 10 очков
• идентификаторы, такие как #user123, стоят 100 очков
• Общая оценка для селектора является суммой всех его частей, поэтому div.class стоит 11 (10 для .class и 1 для div

(На самом деле это немного сложнее, чем это - см. эту статью для деталей - но это объяснение работает как общее правило)

Edit:

Я только что видел ваш комментарий о незнании значений по умолчанию.

Согласно Firebug, hr выглядит так:

 hr {
   height: 0;
   width: 100%;
   border: 1px solid #808080;
   margin: 8px 0;
 }

Вы можете использовать инструменты, предоставляемые в других браузерах, чтобы увидеть, используют ли они другой набор стилей, а затем решить для себя, какие из них лучше всего использовать.

Answer 2

Попробуйте YUI 2 Base CSS , кажется, делает то, что вы хотите. Или даже YUI 3 Base CSS

Существует возможность "восстановить" стили по умолчанию только для определенного контекста

Обновление Только что проверил - Базовый CSS не включает стили для элемента hr

Answer 3

Таблица стилей по умолчанию для документов HTML, без каких-либо переопределений, определяется W3C. Вы можете найти полную таблицу стилей по умолчанию здесь: http://www.w3.org/TR/CSS2/sample.html

Кроме того, вы можете использовать Firebug в Firefox (или любой подобный инструмент) для просмотра стилей элемента <hr /> на тестовой странице без применения каких-либо стилей.

Answer 4

Вы также можете придать своим стилям больший вес с помощью свойства !important.Если оригинал выглядит так:

.someClass { color: red }

Вы можете переопределить его следующим образом:

.someClass { color: green !important}

Answer 5

Нет. Вы должны либо не применять стили в первую очередь, либо переопределять каждый сломанный стиль с явными значениями.

Answer 6

Конечно, вам нужно придать своим стилям больший вес; добавить идентификатор в ваш

---

или сделать это в CSS:

 html body hr { ... your styles ... }