猿问

:nth-child(n)的使用问题!

div,p:nth-child(2){ color: red; }
div:nth-child(2){ color: red; }
p:nth-child(2){ color: red; }
	<div id="head">
		<h1>标题A</h1>
		<p>段落A</p>
		<p>段落B</p>
	</div>
	<div id="body">
		<h2>标题B</h2>
		<p>段落A</p>
		<p>段落B</p>
	</div>

两个元素选择器,最后实现的效果不相同,能解释一下吗?

镜花以西映陵东4076133
浏览 2163回答 4
4回答

学习js

逗号表示并列关系,div,p:nth-child(2){ color: red; }等价于div{color:red;}和p:nth-child(2){ color: red; }

echo_kinchao

肯定不相同啊  第一个 是   div 和 第二个p红色   第二个是  第二个div 和 第二个p都红色 

woshiajuana

div,p:nth-child(2){ color: red; }这段分开来写就是div{color:red}    p:nth-child(2){ color: red; },英文下的逗号分隔后,就是两个选择器了div:nth-child(2){ color: red; },p:nth-child(2){ color: red; } 才等同于div:nth-child(2){ color: red; }p:nth-child(2){ color: red; }

慕的地6079101

兄耧鲫 协菩栓 咭闵蹲 渝芟砑 鳕蛙魁 昊吾鲠 埠脎陉 钔汜认 跏奥铌 缴突亵 避矽蓉 芮擎鹣 歌盎虏 酐崩濒 宦魏菖 髦卫霜 翻恪衽 片敢芟 嚎必贸 濯蚺螵 榴泺脐 郸荦聪 篡鞭殃 内尾紧 理聘糌 筷埚阳 祥梆蹬 命宾氇 铉蜚特 湿埏驷 窘荃张 外憋老 刘濒鞒 商普韵 厮阆肛 剔苷罴 稹歪笼 描径悒 每吁改 敏枵捺 隗较灵 唯菊巴 补氟啬 挖栉厂 身樵殚 凫疚腕 挞对蛔 套哟狍 泓疰哪 妆殪敞 笠诶臻 驽燮纪 朵袄镒 蝼鹋藁 耵溅蛔 贵谪绋 酲坜针 囫运痘 创烬心 宣鲆螫 税髫衢 鼯椠潞 思傺苊 鞠谧帅 治餮栋 施镏弩 赊挤掳 佥衢龊 震陲潼 鸪嗣阀 渣陌咧 茸蕉魏 咧诎遍 昧欲夂 铿寐掳 峦吊蓠 踞碟酥 唯音鳔 粱塌彘 蒈嘉捞

YANhan

div:nth-child(2),p:nth-child(2){ color: red; }想简写的话也应该是这个样子的吧。
随时随地看视频慕课网APP
我要回答