<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
*{
margin:0;
padding:0;}
li{
list-style:none;
width:188px;
height:35px;
font-size:12px;
line-height:35px; /*有line-height不打height效果是和打了一样的*/
font-weight:500;
color:#333333;
}
li:hover{
background:#F0F0F0;
border-radius:5px;}
img{
padding:9px 9px 0px 9px; /*padding和margin是一样的效果*/
float:left;} /*浮动一定要加*/
</style>
</head>
<body>
<div>
<ul>
<li><img src="images/p1.jpg">正在播放</li>
</ul>
<ul>
<li><img src="images/p2.jpg">播放历史</li>
</ul>
<ul>
<li><img src="images/p3.jpg">我收藏的单曲</li>
</ul>
</div>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
*{
margin:0;
padding:0;}
li{
list-style:none;
width:188px;
height:35px;
font-size:12px;
line-height:35px; /*有line-height不打height效果是和打了一样的*/
font-weight:500;
color:#333333;
}
li:hover{
background:#F0F0F0;
border-radius:5px;}
img{
padding:9px 9px 0px 9px; /*padding和margin是一样的效果*/
float:left;} /*浮动一定要加*/
</style>
</head>
<body>
<div>
<ul>
<li><img src="images/p1.jpg">正在播放</li>
</ul>
<ul>
<li><img src="images/p2.jpg">播放历史</li>
</ul>
<ul>
<li><img src="images/p3.jpg">我收藏的单曲</li>
</ul>
</div>
</body>
</html>
正常:
少float:left; 就算还正常点儿吧……
少padding或margin
这不是炸了吗
白天没有网 写的时间太晚了 居然忘了要写点儿什么了 先放这儿 想起来再写 我这个小白 真得一点儿点儿积累