描述:
first-child和last-child同时作用于同一类型标签时,只有first-child起作用,它们的父标签都是指向body
相关截图:
相关代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
p:first-child{
color: red;
}
p:last-child{
color:blue;
}
</style>
</head>
<body>
<p>我是第一个段落</p>
<p>我是第二个段落</p>
</body>
</html>
原因及解决方法:
在使用vscode的live server打开页面时,会生成一个script的一个标签,那么这样来看p:last-child没有生效就能解释了。
直接在控制台中删掉script标签就行了。
或者直接双击打开html文件也是ok的。