CSS选择每个div的第一个子代元素p怎么实现啊?
<!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> 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)')
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也行)。
页:
[1]