Как мне сделать мои селекторы более конкретными? - PullRequest
1 голос
/ 14 апреля 2009

На странице я использую вкладку с собственными таблицами стилей. Эта полоска написана с помощью div и якорей.

Я добавляю некоторые другие элементы div во вкладки, но они наследуют таблицу стилей от внешней вкладки. Этот новый div имеет свои собственные классы CSS.

Вот мой вопрос, есть ли способ разорвать это наследство без изменения структуры CSS?

Стили CSS вкладок:

div.tabs {
    padding: .5em;
}
div.tabs div.tabs {
    padding: 0;
}
div.tabs div.tabs div {
    clear: left;
    height: 4em;
    padding: .5em;
    border: 1px solid #003366;
}

Новые добавленные div используют следующие классы:

.graphTextItem{ font-family:sans-serif; font-size:12px; border: solid 1px #78ACFF; text-align:center; width:150px; }
.graphImageItem{ border-left: solid 1px #78ACFF; border-right: solid 1px #78ACFF; text-align:center; height:70px; }

Ответы [ 4 ]

4 голосов
/ 15 апреля 2009

Вы всегда можете попробовать использовать разные элементы для каждого вложенного уровня вместо всех div:

<div>
   <ul>
      <li></li>
   </ul>
</div>

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

2 голосов
/ 14 апреля 2009

Не совсем. Наследование является частью CSS. Если вы хотите конкретное значение, укажите его.

2 голосов
/ 14 апреля 2009

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

например. в .graphTextItem, переопределить высоту и отступы.

0 голосов
/ 14 апреля 2009

Удаление div из этой таблицы стилей решило мою проблему:

div.tabs div.tabs {
    clear: left;
    height: 4em;
    padding: .5em;
    border: 1px solid #003366;
}

Но мне все еще интересно, есть ли способ?

...