鱼C论坛

 找回密码
 立即注册
查看: 3014|回复: 2

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

[复制链接]
发表于 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的添加样式。
  1.     div > p:first-child {
  2.             color: red;
  3.         }
复制代码


显然:
  1. <div>
  2.     <ul>列表1</ul>
  3.     <p>列表2</p>
  4.     <p>列表3</p>
  5.     <p>列表4</p>
  6.     <p>列表5</p>
  7. </div>
复制代码


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

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



想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2018-10-5 00:14:55 | 显示全部楼层
  1. from bs4 import BeautifulSoup

  2. html = '''
  3. <!DOCTYPE html>
  4. <html lang="en">
  5. <head>
  6.         <meta charset="UTF-8">
  7.         <title>Document</title>
  8.         <style>
  9.                 div > p:first-child {
  10.                         color: red;
  11.                 }

  12.         </style>
  13. </head>
  14. <body>
  15.         <div>
  16.                 <ul>列表1</ul>
  17.                 <p>列表2</p>
  18.                 <p>列表3</p>
  19.                 <p>列表4</p>
  20.                 <p>列表5</p>
  21.         </div>
  22.         <div>
  23.                 <p>列表</p>
  24.                 <p>列表</p>
  25.                 <p>列表</p>
  26.                 <p>列表</p>
  27.                 <p>列表</p>
  28.         </div>
  29.         <div>
  30.                 <s>列表</s>
  31.                 <p>列表</p>
  32.                 <p>列表</p>
  33.                 <p>列表</p>
  34.                 <p>列表</p>
  35.         </div>
  36.         <div>
  37.                 <p>列表</p>
  38.                 <p>列表</p>
  39.                 <p>列表</p>
  40.                 <p>列表</p>
  41.                 <p>列表</p>
  42.         </div>
  43.         <div>
  44.                 <p>列表</p>
  45.                 <p>列表</p>
  46.                 <p>列表</p>
  47.                 <p>列表</p>
  48.                 <p>列表</p>
  49.         </div>
  50. </body>
  51. </html>
  52. '''

  53. soup = BeautifulSoup(html, 'lxml')
  54. p = soup.select('div > p:nth-of-type(1)')
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2018-10-5 09:09:46 | 显示全部楼层    本楼为最佳答案   
1、目前鱼油的CSS是div下的第一个元素是p的添加样式。
  1.     div > p:first-child {
  2.             color: red;
  3.         }
复制代码


显然:
  1. <div>
  2.     <ul>列表1</ul>
  3.     <p>列表2</p>
  4.     <p>列表3</p>
  5.     <p>列表4</p>
  6.     <p>列表5</p>
  7. </div>
复制代码


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

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



想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-5-4 01:06

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表