[已解决]CSS选择每个div的第一个子代元素p怎么实现啊？

anhaoGS · 发表于 2018-10-4 21:03:44

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div > p:first-child {
color: red;
}

</style>
</head>
<body>
<div>
<ul>列表1</ul>
<p>列表2</p>
<p>列表3</p>
<p>列表4</p>
<p>列表5</p>
</div>
<div>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
</div>
<div>
<s>列表</s>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
</div>
<div>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
</div>
<div>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
<p>列表</p>
</div>
</body>
</html>

最佳答案

月排行榜 / 总排行榜

不二如是

2018-10-5 09:09:46

1、目前鱼油的CSS是div下的第一个元素是p的添加样式。

    div > p:first-child {
            color: red;
        }

显然：

<div>
    <ul>列表1</ul>
    <p>列表2</p>
    <p>列表3</p>
    <p>列表4</p>
    <p>列表5</p>
</div>

第一个div下的第一个元素不是p,所以无法实现效果。

2、想要实现div下出现的第一个元素p添加样式，最‘傻’的办法指定class（id也行）。

跳转到最佳答案楼层

在东边 · 发表于 2018-10-5 00:14:55

from bs4 import BeautifulSoup

html = '''
<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
                div > p:first-child {
                        color: red;
                }

        </style>
</head>
<body>
        <div>
                <ul>列表1</ul>
                <p>列表2</p>
                <p>列表3</p>
                <p>列表4</p>
                <p>列表5</p>
        </div>
        <div>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
        </div>
        <div>
                <s>列表</s>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
        </div>
        <div>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
        </div>
        <div>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
                <p>列表</p>
        </div>
</body>
</html>
'''

soup = BeautifulSoup(html, 'lxml')
p = soup.select('div > p:nth-of-type(1)')

不二如是 · 发表于 2018-10-5 09:09:46

1、目前鱼油的CSS是div下的第一个元素是p的添加样式。

    div > p:first-child {
            color: red;
        }

显然：

<div>
    <ul>列表1</ul>
    <p>列表2</p>
    <p>列表3</p>
    <p>列表4</p>
    <p>列表5</p>
</div>

第一个div下的第一个元素不是p,所以无法实现效果。

2、想要实现div下出现的第一个元素p添加样式，最‘傻’的办法指定class（id也行）。

账号		自动登录	找回密码
密码			立即注册