xiawenhao
V2EX  ›  问与答

css 选择器如何选择文章结构中的第一个 <p> 元素

  •  
  •   xiawenhao · Apr 24, 2019 · 6347 views
    This topic created in 2761 days ago, the information mentioned may be changed or developed.

    例如 html 结构是下面这样的,css 中有方法只选择 <h1> 元素后面的出现的第一个 <p> 元素吗?

    <html>
        <h1></h1>
        <p></p>
        <P></P>
        <p></p>
    </html>
    
    
    21 replies  •  2019-04-24 15:22:30 +08:00
    EridanusSora
    EridanusSora
    Apr 24, 2019 via Android
    1
    h1>p
    EridanusSora
    EridanusSora
    Apr 24, 2019 via Android
    2
    不好意思看错题了,无视。。
    leefly
    leefly
    Apr 24, 2019
    3
    h1 + p
    BCy66drFCvk1Ou87
    BCy66drFCvk1Ou87
    Apr 24, 2019❤️1
    4
    ````
    p:first-of-type {
    //
    }
    ````
    EridanusSora
    EridanusSora
    Apr 24, 2019 via Android
    5
    应该是 h1 + p
    GiRLIn11
    GiRLIn11
    Apr 24, 2019 via Android
    6
    用相邻兄弟选择器,h1 + p。建议你补下 CSS 基础知识。
    Sapp
    Sapp
    Apr 24, 2019
    7
    @HuasLeung 你这选择的是整个文本第一个 p,而不是 h1 后面第一个,应该是 + 才是对的
    BCy66drFCvk1Ou87
    BCy66drFCvk1Ou87
    Apr 24, 2019
    8
    @Sapp lz 给的代码只有这么一段,按你的思路,你又怎么知道 h1 就是整个文本的第一个 h1 ?
    Sapp
    Sapp
    Apr 24, 2019
    9
    @HuasLeung 杠起来真得劲儿,人都明显的说了 h1 之后的第一个 p,都是猜,你为什么就不能注意点 h1 之后这个条件?
    BCy66drFCvk1Ou87
    BCy66drFCvk1Ou87
    Apr 24, 2019
    10
    @Sapp 语气没问题吧,不是杠……
    zqx
    zqx
    Apr 24, 2019 via Android
    11
    h1+p 选择的是所有 h1 后面的第一个 p,即使有多个 h1 也没问题
    BCy66drFCvk1Ou87
    BCy66drFCvk1Ou87
    Apr 24, 2019
    12
    @Sapp
    @zqx
    举个简单的例子
    ````
    <html>
    <h1></h1>
    <p></p>
    <h1></h1>
    <p></p>
    <P></P>
    <p></p>
    </html>
    ````
    h1+p 会波及第二个 p,你们确定的相邻选择器能满足 lz 的题目要求?
    whitegerry
    whitegerry
    Apr 24, 2019
    13
    @HuasLeung lz 题目里的 html 没看到么?
    FakeLeung
    FakeLeung
    Apr 24, 2019
    14
    所以说,题目有问题。
    BCy66drFCvk1Ou87
    BCy66drFCvk1Ou87
    Apr 24, 2019
    15
    @whitegerry 看到了,有什么问题么?
    4ark
    4ark
    Apr 24, 2019 via Android
    16
    没有 class 的吗?
    ayase252
    ayase252
    Apr 24, 2019 via iPhone
    17
    标题说的题目和内容说的题目不是一回事啊
    iblessyou
    iblessyou
    Apr 24, 2019
    18
    @HuasLeung
    我觉得你别理那些人了,
    题目问的也有问题,“文章结构”到底是指 HTML,还是 HTML 内的一个区域,
    看起来是区域,不过举的例子又加俩 HTML 标签不知道什么意思,那不就是整个 HTML 了。

    还有,那个“例如”。。。说明这例子是随手写的,不是他的代码结构,那 h1 也是随手写的。。。有毛的讨论价值
    ayson23
    ayson23
    Apr 24, 2019
    19
    这种元素选择器都是基础,W3C 或者菜鸟教程都可以学到,这类型的多去尝试对比几次就会用了
    shintendo
    shintendo
    Apr 24, 2019
    20
    @Sapp
    人家也没杠,楼主题目本来就不严谨,各自有各自的理解,你也说了都是猜。
    以例子为准,两个写法都对,以“ h1 之后的第一个 p ”这句话为准, 两个写法都错,谁知道 h1 和 p 直接有没有隔着什么
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1141 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 61ms · UTC 18:07 · PVG 02:07 · LAX 10:07 · JFK 13:07
    ♥ Do have faith in what you're doing.