<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
/*li:nth-child(3){
color:tomato;
}
li:nth-last-child(2){
color:fuchsia;
}*/
li:first-child{
color: red;
}
li:last-child{
color:yellow;
}
p:nth-of-type(2){
color:cyan;
}
</style>
<title>结构伪类选择器</title>
</head>
<body>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
<li>列表项4</li>
<li>列表项5</li>
<li>列表项6</li>
<li>列表项7</li>
<li>列表项8</li>
</ul>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
<li>列表项4</li>
<li>列表项5</li>
<li>列表项6</li>
<li>列表项7</li>
<li>列表项8</li>
</ul>
<div>
<p>段落1</p>
<div>伪段落</div>
<p>段落2</p>
<p>段落3</p>
<p>段落4</p>
</div>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
/*li:nth-child(3){
color:tomato;
}
li:nth-last-child(2){
color:fuchsia;
}*/
li:first-child{
color: red;
}
li:last-child{
color:yellow;
}
p:nth-of-type(2){
color:cyan;
}
</style>
<title>结构伪类选择器</title>
</head>
<body>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
<li>列表项4</li>
<li>列表项5</li>
<li>列表项6</li>
<li>列表项7</li>
<li>列表项8</li>
</ul>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
<li>列表项4</li>
<li>列表项5</li>
<li>列表项6</li>
<li>列表项7</li>
<li>列表项8</li>
</ul>
<div>
<p>段落1</p>
<div>伪段落</div>
<p>段落2</p>
<p>段落3</p>
<p>段落4</p>
</div>
</body>
</html>
扫一扫
238
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
