1、学会布局
2、学会隐藏超出文本
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>3.11新闻</title>
<link rel="icon" type="img/x-icon" href="favicon.ico">
<style type="text/css">
*{
margin:0px;
padding: 0px;
font-family: 宋体
}
div{
width: 660px;
height: 360px;
border: 1px solid #ccc;
margin: auto;/*DIV页面居中*/
padding:20px;/*左右留有空隙，布局美观*/
}
p abbr{
line-height: 40px;
text-decoration: none;/*去掉下划线*/
}
ul{
width: 660px;
height:360px;
}
ul li{
height: 20px;
line-height: 20px;
width:400px;
/*border: 0px solid red;布局时，查看li的间隔*/
white-space: nowrap;/*取消文本换行*/
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 5px;
}
</style>
</head>
<body>
<div>
<h2>PHP第一天作业</h2>
<p><abbr title="两会新闻">新闻列表</abbr></p>
<ul>
<li>人社部部长承诺！保证养老保险金及时足额发放</li>
<li>企业社保费率的降低不会影响养老保险金的发放，“保证养老金的及时足额发放</li>
<li>“两高”报告关注正当防卫：法不能向不法让步！</li>
<li>全哲洙：法治化要防止把经济纠纷当犯罪处理</li>
</ul>
</div>
</body>
</html>