html/css关于child的问题
本帖最后由 ixeliap 于 2020-2-10 20:22 编辑最近因为工作被居家隔离了，赋闲在家，闲来无事学了一下web，遇到bug了
<!DOCTYPE html>
<html lang="en">
<head>
<style>
body {
background-color: #ccc
}
div {
color : #ccc;
font : 700 80px '等线' ;
}
div:first-child {
text-shadow : 1px 1px 1px #000 , -1px -1px 1px #fff;
}
div:last-child {
text-shadow : -1px -1px 1px #000 , 1px 1px 1px #fff;
}
</style>
<meta charset="UTF-8">
<title>practice</title>
<link rel="stylesheet" type="text/css" href="练习.css">
</head>
<body>
<div >
突起的文字
</div>
<div>
凹下的文字
</div>
</body>
</html>
代码如上。浏览器打开ok。但是dw打开就不显示last-child。
此外，如果在第二个div下面随意加任何标签浏览器也不显示凹下的文字
求教一下各位哪里出问题了呢？ 没用过DW，不清楚，IE和Chrome打开都没问题。
在第二个div加标签也没出现问题。 深巷丶 发表于 2020-2-10 21:06
没用过DW，不清楚，IE和Chrome打开都没问题。
在第二个div加标签也没出现问题。
这样子，不是加在里面 ixeliap 发表于 2020-2-10 21:19
这样子，不是加在里面
你这是p标签，你在前面的样式中只设置了div的样式，并没有设置p标签中的样式，所以，你在p标签中的内容就不会显示凹下的样式，不知道我理解的对不对， 本帖最后由 深巷丶 于 2020-2-10 21:50 编辑
first-child和last-child选择器之前都没用过，查了资料才知道，你看看能理解不？
[*]E:first-child选择符，E必须是它的兄弟元素中的第一个元素，换言之，E必须是父元素的第一个子元素。与之类似的伪类还有E:last-child，只不过情况正好相反，需要它是最后一个子元素。
如果无法理解，看看这两篇文章可能有所帮助
https://www.jianshu.com/p/4837fb9a6f6e
https://www.cnblogs.com/snowbaby-kang/p/3955672.html 缘来是熊孩子 发表于 2020-2-10 21:34
你这是p标签，你在前面的样式中只设置了div的样式，并没有设置p标签中的样式，所以，你在p标签中的内容就 ...
‘凹下的文字’下面不论加什么，只要有加上任何标签，’凹下的文字‘的阴影都不显示出来。 深巷丶 发表于 2020-2-10 22:04
如果无法理解，看看这两篇文章可能有所帮助
https://www.jianshu.com/p/4837fb9a6f6e
https://www.cnblog ...
和我描述的问题不一样 本帖最后由 深巷丶 于 2020-2-10 23:04 编辑
ixeliap 发表于 2020-2-10 22:36
和我描述的问题不一样
哪里不一样了，你这个就是在第二个div标签下加了一个p标签，导致第二个div在父元素也就是body标签内不是最后一个标签了，因此last-child选择器失效了，就显示不出来了啊，我给你的文章写的是first-child而已，这俩选择器都一样啊 你还无法理解我只能说我能力有限了。或者我的想法是错的
页:
[1]
2