个人中心
gpt4 book ai didi

css - 只选择第一个元素，不考虑类型

转载 作者：行者123 更新时间：2023-11-28 16:29:01 25 4
gpt4 key购买 nike

我只想将样式应用于容器的绝对第一个元素，如果它是 h1、h2 或 h3...但是，如果在同一页面中有不同的标题(h1、h2、h3 ), 只有第一个应该继承样式。

例如。

<div class="container">
   <h2>I want to change this</h2>

   <p>....</p>
   <h3>But not this!</h3>
   <h2>and not this!</h2>
</div>

我尝试使用这段代码:

.container h1:first-of-type, .container h2:first-of-type, .container h3:first-of-type {
    padding-top: 0 !important;
}

问题是第一个 H2 和 H3 都受此代码影响。

我什至尝试过这个......但没有成功:

.container > h1:first-of-type, .container > h2:first-of-type, .container > h3:first-of-type {
    padding-top: 0 !important;
}

我该怎么做？

最佳答案

现在再试一次，我想这就是你要找的东西

<!DOCTYPE html>
<html>
<head>
<style>
.container > h1:first-child{
    background-color: yellow;
}
.container > h2:first-child  {
    background-color: orange;
}
.container > h3:first-child {
    background-color: red;
}
</style>
</head>
<body>
<div class="container">
   <h2>I want to change this</h2>

   <p>....</p>
   <h3>But not this!</h3>
   <h2>and not this!</h2>
</div>

</body>
</html>

关于css - 只选择第一个元素，不考虑类型，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39721428/

25 4 0
文章推荐： html - 在未折叠的导航栏中对齐按钮链接和阻止按钮
文章推荐： python - 如何从日期字符串中获取日期格式？
文章推荐： html - 对象跟随响应式背景图像
文章推荐： javascript - 将时钟上弦至当前时间
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com