<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无序UL列表鼠标经过更换背景色</title>
<style type="text/css">
#links ul {
list-style-type: none;
width: 280px;
}
#links li {
border: 1px dotted #06f;
border-width: 1px 0;
margin-bottom: 16px;
}
#links li a {
color: #00f;
display: block;
font: bold 120% Arial, Helvetica, sans-serif;
padding: 8px;
text-decoration: none;
}
* html #links li a {
width: 280px;
}
#links li a:hover {
background: skyblue;
}
#links a em {
display: block;
font: normal 85% Verdana, Helvetica, sans-serif;
line-height: 125%;
}
#links a span {
font: normal 70% Verdana, Helvetica, sans-serif;
line-height: 150%;
}
</style>
</head>
<body>
<div id="links">
<ul>
<li><a href="#" title="欢迎光临">小胡设计室</em> <span><br>专业代做ASP.NET毕业设计！</span></a></li>
<li><a href="#" title="欢迎光临">小胡设计室</em> <span><br>专业代做ASP.NET毕业设计！</span></a></li>
</ul>
</div>
</body>
</html>
- 本文标题： 鼠标经过UL上的li时更换背景色
- 文章分类：【HTML/CSS】
- 非特殊说明，本文版权归【胡同里的砖头】个人博客 所有，转载请注明出处.