Как установить css дочерний элемент, но не применять для внутреннего элемента дочернего элемента? - PullRequest
Новая
       8

Как установить css дочерний элемент, но не применять для внутреннего элемента дочернего элемента?

0 голосов
/ 25 февраля 2020

У меня есть простой код, как показано ниже. Я хочу установить css красный цвет для текста aaa. Вы можете видеть, что я установил css для span Я думал, что только текст aaa будет устанавливать красный цвет, однако css применяется для aaa и bbb. Я не понимаю это Пожалуйста, объясни мне это. 

<!DOCTYPE html>
<html>
  <head>
      <title>Page Title</title>
      <style>
          #test > span {
              color:red
          }
      </style>
  </head>
  <body>
      <div id="test">
          <span>aaa
              <span>bbb</span>
          </span>
      </div>
  </body>
</html>

Ответы [ 2 ]

1 голос
/ 25 февраля 2020

попробуйте css! 

#test > span >span{
    color:black;
}

#test > span{
    color:red;
}
<!DOCTYPE html>
<html>
  <head>
      <title>Page Title</title>
  </head>
  <body>
      <div id="test">
          <span>aaa
              <span>bbb</span>
          </span>
      </div>
  </body>
</html>
1 голос
/ 25 февраля 2020 
<!DOCTYPE html>
<html>
  <head>
      <title>Page Title</title>
      <style>
          #test > span {
              color:red
          }
         #test > span > span {
              color: #000;
          }
      </style>
  </head>
  <body>
      <div id="test">
          <span>aaa
              <span>bbb</span>
          </span>
      </div>
  </body>
</html>
...