<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
ul li{
width:100px;
height: 50px;
background: #784445;
color: #FFFFFF;
text-align: center;
margin: 10px;}
ul li:hover{/*鼠标移上去文字变色*/
color:red;}
ul li:nth-of-type(3){/*结构化伪类 选择ul标签下面的相同类型的第三个li标签*/
background: url("20 - 副本.jpg") no-repeat;}
input:checked +lable{ /*设置input被选中时 lable标签的文字颜色*/
color:yellow;}
</style>
</head>
<body>
<div>
<ul>
<li>nihao</li>
<li>nihao</li>
<li>nihao</li>
</ul>
</div>
<form action="">
<input type="checkbox">
<lable>你好</lable>
<input type="checkbox">
<lable>我好</lable>
<input type="checkbox">
<lable>都好</lable>
</form>
</body>
</html>