overflow:hidden清除浮动的一个简单的列子
<style type="text/css" media="screen">
*{
margin: 0;
padding: 0;
}
.news{
width: 500px;
height:300px;
border:1px solid #000;
margin: 100px;
}
ul{
list-style: none;
/*去掉列表的小圆点*/
}
li{
border-bottom: 1px dashed gray;
/*下底框:虚线*/
overflow: hidden;
}
.tittle{
float: left;
}
.date{
float: right;
}
</style>
</head>
<body>
<div class="news">
<ul>
<li>
<span class="tittle">新闻标题</span>
<span class="date">时间</span>
</li>
<li>
<span class="tittle">新闻标题</span>
<span class="date">时间</span>
</li>
<li>
<span class="tittle">新闻标题</span>
<span class="date">时间</span>
</li>
</ul>
</div>
</body>
欢迎大家关注DataLearner官方微信,接受最新的AI技术推送
