源码如下:
<!DOCTYPE html PUBLIC "-/ ...
新闻标题的长度太长,要用 css代码直接解决,不但简单,而且效果比用程序实现的更完美,因为用程序控制,只能固定截取多少个字符,而用css的话可以自己适应列表的宽度.
源码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS_梦想资源库</title><style>
body{
font: 12px/18px Verdana, Arial, Helvetica, sans-serif;
background-color: #F8F8F8;
color: #333;
}
a:link, a:visited{
text-decoration: none;
font-size: 12px;
color: #333333;
}
a:hover{
text-decoration: underline;
color: #0066FF;
}
.content{
float:left;
width:40%;
height:auto;
border: 1px solid #ccc;
background-color: #FFF;
}
.content ul{ padding:3px; padding-bottom:6px; margin:0; list-style:none;}
.content ul li{
border-bottom: 1px solid #F0F0F0;
height: 21px;
overflow: hidden; /*首先设定列表的高度,然后用溢位隐藏*/
line-height: 21px;/*字体行高最好要和列表高度一样或者大些*/
background: url(images/dot.gif) no-repeat 0px 8px;
padding-left: 10px;
}
.bar{
color:#FFF;
height:20px;
font-weight:bold;
background:#698FC7;
text-indent: 15px;
line-height: 20px;
margin: 0px;
padding: 0px;
border: 3px double #698FC7;
}
.bar a:link ,.bar a:visited,.bar a:hover{
color:#FFF;
text-decoration: none;
}
#date{ float:right;}
</style>
</head>
<body>
<div class="content">
<h2 class="bar"><a href="list?tid=7">梦想资源库,梦想的启点;</a></h2>
<ul>
<li><span id="date">[11-29]</span>[<a href=#>it</a>] <a href="http://www.dreampp.cn" title="http://www.dreampp.cn">梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;梦想资源库,梦想的启点;</a></li>
<li><span id="date">[10-25]</span>[<a href="http://www.dreampp.cn/it">HTML</a>] <a href="http://www.dreampp.cn" title="发布可编辑评论补丁">发布可编辑评论补丁发布可编辑评论补丁发布可编辑评论补丁</a></li>
<li><span id="date">[10-11]</span>[<a href="http://www.dreampp.cn">PHP</a>] <a href="http://www.dreampp.cn" title="发布Phpwind论坛调用程序">发布Phpwind论坛调用程序</a></li>
<li><span id="date">[10-11]</span>[<a href="http://www.dreampp.cn">MYSQL</a>] <a href=# title="[更新]发布Discuz论坛调用程序">[更新]发布Discuz论坛调用程序发布Discuz论坛调用程序</a></li>
<li><span id="date">[10-06]</span>[<a href="http://www.dreampp.cn">ORACLE</a>] <a href="http://www.dreampp.cn" title="最新更新:刚刚修正几个程序的BUG">最新更新:刚刚修正几个程序的BUG几个程序的BUG</a></li>
</ul>
</div>
</body>
相关文章
[错误报告] [推荐] [收藏] [打印] [关闭] [返回顶部]


已有