网页新闻中心ul+下划虚线的排版

最新推荐文章于 2021-09-09 09:27:12 发布

buzhang1314

最新推荐文章于 2021-09-09 09:27:12 发布

阅读量804

点赞数

分类专栏：网页排版网页特殊效果文章标签：新闻中心排版新闻中心+下划线排版

本文链接：https://blog.csdn.net/buzhang1314/article/details/38690729

版权

网页特殊效果同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

网页排版

2 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>新闻中心</title>

<style>
/*---------新闻中心开始--------------*/
.xwzx {
font-size:12px;
width: 743px;
height: auto;
overflow: hidden;
}
.xwzxt {
background-image: url(images/newsbg.png);
background-repeat: no-repeat;
width: 743px;
height: 46px;
}
.xwzxt P {
color: #AF0002;
font-size: 14px;
font-weight: bold;
margin-left: 30px;
line-height: 27px;
}
.xwzxt P span {
float: right;
font-size: 12px;
font-weight: 400;
}
.xwzxt P span a {
}
.xwzxt P span a:hover {
color: #FF0004;
}
.xwzxb{
border: #C7C7C7 1px solid;
}
.xwzxb ul {
padding: 10px 0px 0px 15px;
width: 726px;
height: auto;
overflow: hidden;
display: block;
background-color:#FFFFFF;
}
.xwzxb ul li {
background-image:url(images/newssanjiao.png);
background-repeat: no-repeat;
background-position: left center;
width: 721px;
height: 30px;
line-height: 30px;
overflow: hidden;
border-bottom-color: rgb(193, 193, 193);
border-bottom-width: 1px;
border-bottom-style: dashed;
display: block;
}
.xwzxb ul li span {
width: 74px;
height: 30px;
color: rgb(119, 119, 119);
overflow: hidden;
padding-left: 30px;
float: right;
display: block;
}
.xwzxb ul li a {
color: rgb(51, 51, 51);
padding-left: 22px;
}
.xwzxb ul li a:hover {
color: rgb(255, 0, 0);
}
.xwzxnum{
background-color:#FFFFFF;
text-align:center;
line-height:40px;
}
.xwzxnum a:hover{
color: rgb(255, 0, 0);
}
/*-----------新闻中心结束-------------------*/
</style>
</head>

<body>

<div class="xwzx">
<div class="xwzxt">
<p>新闻中心<span>您当前位置： <a href="#">网站首页</a> > <a href="#">新闻动态</a></span> </p>
</div>
<div class="xwzxb">
<UL>
<LI><SPAN>[2014-07-12]</SPAN><A href="#">我公司为企业上市助力－FRD战略与</A></LI>
<LI><SPAN>[2014-07-11]</SPAN><A href="#">我公司顾问积极帮助客户进行年度规</A></LI>
<LI><SPAN>[2014-07-10]</SPAN><A href="#">我公司帮助客户筹划新业务发展</A></LI>
<LI><SPAN>[2014-07-09]</SPAN><A href="#">我公司组织客户交流考察</A></LI>
<LI><SPAN>[2014-07-08]</SPAN><A href="#">杭州大型国企地产开发规划项目正式</A></LI>
<LI><SPAN>[2014-07-07]</SPAN><A href="#">我公司为国内大型GPS导航企业提供</A></LI>
<LI><SPAN>[2014-07-06]</SPAN><A href="#">我公司与LEJT签署人力资源体系咨询</A></LI>
<LI><SPAN>[2014-07-05]</SPAN><A href="#">我公司为企业上市助力－FRD战略与</A></LI>
<LI><SPAN>[2014-07-04]</SPAN><A href="#">我公司顾问积极帮助客户进行年度规</A></LI>
<LI><SPAN>[2014-07-03]</SPAN><A href="#">我公司帮助客户筹划新业务发展</A></LI>
<LI><SPAN>[2014-07-02]</SPAN><A href="#">我公司组织客户交流考察</A></LI>
<LI><SPAN>[2014-07-01]</SPAN><A href="#">杭州大型国企地产开发规划项目正式</A></LI>
<LI><SPAN>[2014-06-30]</SPAN><A href="#">我公司为国内大型GPS导航企业提供</A></LI>
</UL>
<div class="xwzxnum"> <a href='#'>首页</a> <a href='#'>< 上一页</a> <a href='#'>1</a> <span>2</span> <a href='#'>3</a> <a href='#'> <a href='#'>下一页</a> <a href='#'>< 尾页</a></div>
</div>
</div>


</body>
</html>