о css ul свойства

Question

если я укажу как

.a ul{}
.a ul li{}

и

.b ul{}
.b ul li{}

Будут ли свойства ul в .b полностью отделены от свойств ul из .a? или они будут обычными?

Я хочу, чтобы стили ul оставались полностью отделенными от стиля ul в .b без использования div id. спасибо.

Answer 1

Пока вы гарантируете в своем HTML, что у вас нет элементов class="a" внутри элементов class="b" или наоборот, ваши селекторы будут применяться к отдельным <ul>.

Они будут толькообщее для <ul> с как .a, так и .b, если:

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

  .a ul, .b ul {}
  .a ul li, .b ul li {}
  

• Вы объявляете одинаковые правила стиля для обоих селекторов

• В вашем HTML <ul> содержится внутри элементов обоих классов (будь то class="a b" или .a внутри .b или .b внутри .a), например:

  <div class="a b">
      <ul><li>Item</li></ul>
  </div>
  
  <div class="b">
      <div class="a">
          <ul><li>Item</li></ul>
      </div>
  </div>
  
  <div class="a">
      <div class="b">
          <ul><li>Item</li></ul>
      </div>
  </div>
  

  Обратите внимание, что это полностью применимо, только если вторая пуля также верна;вы можете не получить ожидаемых результатов из-за эффектов каскада .

Answer 2

Любые ссылки в элементе с классом = "a" получат стили .a. Любой в пределах class = "b" получит стиль b.

Если b вложено в a, тогда будут встречаться стили a и b, кроме случаев, когда в a и b задано одно и то же свойство - в этом случае b будет иметь приоритет. например,

<div class="a">
<div class="b">
<ul>
<li>...</li> etc

Если вы определите class = "a b" в контейнере, как пояснил Boltclock, любые стили, определенные как .a.b ul, будут наиболее специфичными и переопределят те же свойства, которые определены в .a или .b. Если общие свойства существуют только в .a и .b, то, что объявлено позже в таблице стилей, имеет приоритет

Answer 3

Если у родителя есть только один из двух классов, .a или .b, они будут полностью разными. Но если родитель имеет оба класса, то зависит от иерархии css .