这个 HTML 中的 <p> 标签，怎样才能用 css 选择器选中呢？

Dive into HTML5

This topic created in 2311 days ago, the information mentioned may be changed or developed.

HTML 结构是这样的：

<div class="items">
    <p>item one</p>
    <p>item two</p>

    <li>
        <p>Notice: ...</p>
    </li>
</div>

CSS 已经写了 p 标签的样式：

.items p { margin: 15px auto };

需要把 li 标签里的 p 标签 margin 修改，却发现覆盖不了 ( .items p { margin: 15px auto } ) ：

li > p { margin: 10px auto }

请教，有什么方式用 CSS 选择器，再选中 li 标签下面的 P 标签，并覆盖 P 标签的 .items p { margin: 15px auto }; 样式吗？ (li 下面的标签 p 没有 id 可选）

5 replies • 2020-01-17 15:14:28 +08:00

AugustCat

Jan 17, 2020

.items li p { margin: 10px auto }

humor66

Jan 17, 2020

.items li p ?

lisisi

Jan 17, 2020

@AugustCat
@humor66

感谢，补齐完整确实可以选中了

LyleRockkk

Jan 17, 2020

这个问题是 css 选择器权值的知识点，楼主可以学习一下相关

AV1

Jan 17, 2020

.class 的权重比 tag 高，所以，“li > p”的样式覆盖不了“.items p”的样式。
另外，按照标准，<li>标签的父元素只能是<ul>、<ol>、<menu>，不能是<div>。