css布局出现的问题
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>单一按钮显示隐藏</title>
<style type="text/css">
container{
margin:10px auto;
text-align:center;
width:200px;
}
top{
background-color:#CED3D7;
height:30px;
}
ul{
list-style:none;
padding:0px;
display:block;
border:1px solid blue;
}
li{
border:1px solid red;
padding-top:3px;
padding-bottom:3px;
cursor:pointer;
}
li:hover{
background-color:white;
}
show{
border:1px solid #aaaaaa;
width:100%;
background-color:#E9EDF2;
}
</style>
</head>
<body>
<div id="container">
<div id="top">
<h3>播放列表....</h3>
</div>
<div id="show">
<ul>
<li>山丘-李宗盛</li>
<li>纪念-蔡健雅</li>
<li>怎么唱情歌-刘惜君</li>
<li>海阔天空-Beyond</li>
<li>温柔-五月天</li>
</ul>
</div>
</div>
</body>
<script type="text/javascript">
</script>
</html>
有两点想问大家
1.为什么标箭头的地方会有两个空余的地方呢，我给ul设了block，并且没有设置高度
2.用什么方法能去掉这两块呢
展开
收起
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
1
条回答
写回答
-
码农|Coder| Pythonista
ul{ margin: 0; }添加这个，这个间距是浏览器默认存在的，用padding:0;margin:0就可以去掉
2019-07-17 19:24:43赞同 展开评论
相关问答