html - <p> 标签 id 样式不受尊重

标签 html css css-selectors

<分区>

我想更改 'id=koll' 的样式,但 css 文件仍然从 '#kava p' 读取 'id=koll' 的样式信息

#kava p {
  font-size: .9rem;
  margin-top: 15px;
  line-height: 1.4rem;
  font-family: 'Tajawal', sans-serif;
  font-weight: 400;
}

#koll {
  font-weight: 400;
  font-size: 1.2rem;
}
<div id='kava'>
  <ol>
    <li>
      <h4>title</h4>
      <p id="koll">sdsd sdg s sdfsdf</p>
      <p>sldfhs sdfh sd sdufhs f sdufhsd</p>
    </li>
  </ol>
</div>

最佳答案

它的发生是因为强大的继承性。

#kava p {
  font-size: .9rem;
  margin-top: 15px;
  line-height: 1.4rem;
  font-family: 'Tajawal', sans-serif;
  font-weight: 400;
}

#kava #koll {
  font-weight: 400;
  font-size: 1.2rem;
}
<div id='kava'>
  <ol>
    <li>
      <h4>title</h4>
      <p id="koll">sdsd sdg s sdfsdf</p>
      <p>sldfhs sdfh sd sdufhs f sdufhsd</p>
    </li>
  </ol>
</div>

关于html - <p> 标签 id 样式不受尊重,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54479072/

上一篇:javascript - JS onClick transform 旋转问题水平垂直

下一篇:css - 如何将angular-7中的 "%"中的 "Point"更改为 "ng-circle-progress"?

相关文章:

jquery - 我需要我的主导航栏在窗口达到一定大小后消失并显示移动菜单

javascript - 错误的调用

css - 在单行上获取文本和选择框

html - Bootstrap 的 CSS float 问题

显示元素之前的 Javascript 样式

"content:"上的 css 动画在 Safari 和 Firefox 上不起作用

css - 选择最后一个 child ,除非它也是第一个 child

html - 表单中的 [data-width] 属性

html - 键盘可访问的下拉菜单不遍历子菜单

CSS : get last HTML tag with a given class, 在一个列表中,不是每个 HTML 标签都有这个类