自动更新新闻的html,html新闻列表制作

新闻列表

*{

padding: 0;

margin: 0;

}

.box{

width: 600px;

height: 290px;

border: 1px solid #d8d8d8;

margin: 50px auto;

overflow: hidden;

}

.box .line{

width:560px;

height: 50px;

margin: 0 auto;

border-bottom: 1px solid #ddd;

line-height: 50px;

}

.box span{

font: bold 18px '微软雅黑';

color: #000;

padding: 15px;

border-bottom: 2px solid red;

}

.box #more{

float: right;

font-weight: bold;

color: #9f9f9f;

text-decoration: none;

}

.box #more:hover{

color: red;

}

.box ul{

list-style: none;

width:560px;

height: 238px;

padding:0;

margin: 7px auto 0;

}

.box ul li{

height:36px;

border-bottom: 1px solid #ddd;

background: url(dot.gif) left center no-repeat;

}

.box ul a{

float:left;

height:36px;

font: bold 14px/36px '微软雅黑';

text-decoration: none;

text-indent: 30px;

color: #000;

background: url(icon.jpg) 5px center no-repeat;

}

.box ul a:hover{

color: red;

}

.box ul p{

float: right;

height: 36px;

font:bold 14px/36px '微软雅黑';

color: #000;

}

新闻列表 更多>>

• 崔龙洙或将现场看苏宁站恒大 称被球队诚意打动

  2016-06-23

• 崔龙洙首尔告别战率队2-1胜 赛后向球迷挥手作别

  2016-06-23

• 崔龙洙或将现场看苏宁站恒大 称被球队诚意打动

  2016-06-23

• 崔龙洙首尔告别战率队2-1胜 赛后向球迷挥手作别

  2016-06-23

• 崔龙洙或将现场看苏宁站恒大 称被球队诚意打动

  2016-06-23

• 崔龙洙首尔告别战率队2-1胜 赛后向球迷挥手作别

  2016-06-23

效果图如下：

news list.png