CSS核心(十一)复合选择器之兄弟选择器--通过兄标签定位弟标签

[复制链接]
查看: 1533|回复: 31
发表于 2023-1-31 19:13:59 | 显示全部楼层 | 阅读模式
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>复合选择器之兄弟选择器--通过兄标签定位弟标签</title>
</head>

<body>
<style>
        div+p{/* 兄弟选择器,哥哥标签+弟弟标签,,,,修饰的是弟弟 */
                color:red;        
        }
        div+p+p+p{ color:blue;}/* 表示选择的是div下方的第三个p标签 */
</style>
<div>《小池》宋朝·杨万里</div>
<p>泉眼无声惜细流,</p>
<p>树阴照水爱晴柔。</p>
<p>小荷才露尖尖角,</p>
<span>无用的标签</span>
<p>早有蜻蜓立上头。</p>
</body>
</html>



解释一下:
以上代码中,我们使用div+p这样的选择器,选择了div下的第一个p标签,使用div+p+p+p选择了div下的第三个p元素。

执行结果如下:
CSS核心(十一)复合选择器之兄弟选择器--通过兄标签定位弟标签

易博软件介绍

0

主题

12

帖子

7

积分

营销入门

Rank: 2

积分
7
发表于 2023-2-16 03:52:52 | 显示全部楼层
让我深有感触,感觉自已差太多太多了   

0

主题

12

帖子

7

积分

营销入门

Rank: 2

积分
7
发表于 2023-2-23 01:09:50 | 显示全部楼层
^感动,真的很有感情,  我喜欢.  祝福作者早日成为一个高手编程员
发表于 2023-2-28 01:53:10 | 显示全部楼层
谢谢你们的留言 ,我看过深感领悟,想不到能在网上看到一些原本上书本看不到的东西。。。。

0

主题

15

帖子

8

积分

营销入门

Rank: 2

积分
8
发表于 2023-3-4 17:14:52 | 显示全部楼层
说的很有道理,我想我真的受益菲浅
发表于 2023-3-11 02:23:55 | 显示全部楼层
受启发了思索中

0

主题

18

帖子

10

积分

营销入门

Rank: 2

积分
10
发表于 2023-3-17 12:21:49 | 显示全部楼层
谢谢  

0

主题

40

帖子

20

积分

终身会员

Rank: 25Rank: 25Rank: 25Rank: 25Rank: 25Rank: 25Rank: 25

积分
20

终身会员

发表于 2023-3-22 10:05:07 | 显示全部楼层
看到你经历,很受用。

0

主题

23

帖子

12

积分

营销入门

Rank: 2

积分
12
发表于 2023-3-28 06:03:05 | 显示全部楼层
well
发表于 2023-3-31 11:48:58 | 显示全部楼层
大大真的是有感受,想想大大的努力和胸襟,眼光也很是让我感叹。想想我自己,真的应该如大大所说!!!在此感谢大大!!!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

1、请认真发帖,禁止回复纯表情,纯数字等无意义的内容!帖子内容不要太简单!
2、提倡文明上网,净化网络环境!抵制低俗不良违法有害信息。
3、如果你对主帖作者的帖子不屑一顾的话,请勿回帖。谢谢合作!
3、问答求助区发帖求助后,如有其他用户热心帮您解决问题后,请自觉点击设为最佳答案按钮。

 
 
QQ在线客服
QQ技术支持
工作时间:
8:00-18:00
软著登字:
1361266号
官方微信扫一扫
weixin

QQ|小黑屋|慈众营销 ( 粤ICP备15049986号 )|网站地图

自动发帖软件 | 自动发帖器 | 营销推广软件 | 网络营销工具 | 网络营销软件 | 网站推广工具 | 网络推广软件 | 网络推广工具 | 网页推广软件 | 信息发布软件 | 网站推广工具 | 网页推广软件

Powered by Discuz! X3.4   © 2012-2020 Comsenz Inc.  慈众科技 - Collect from 深圳吉宝泰佛文化有限公司 公司地址:罗湖区黄贝街道深南东路集浩大厦A1403

返回顶部 返回列表