纯CSS制作的新闻网站中的文章列表

日期：2007年12月25日作者：查看:[大字体中字体小字体]

　　应用CSS制作的新闻网站中的文章列表：ul是html中的无序列表，li是列表中的列表项。如果没有CSS定义它的外观，它默认是显示成一列列表，并且它会存在项目符号(比如方块或实心的黑点)的列表内容。CSS网页布局中，除了新闻列表、链接运行ul、li制作以外，我们通常将菜单也用ul、li来实现。

以下是引用片段：
<!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新闻列表制作webjx.com</title>
<style type="text/css">
.list{
margin: 0px 10px 20px;
text-align: left;
}
.list ul{
list-style-type: none;
margin: 0px;
padding: 0px;
}
.list li{
width: 100%;
}
.list li a{
color: #777777;
display: block;
padding: 6px 0px 4px 15px;
}
.list li span{
float: right;/*使span元素浮动到右面*/
text-align: right;/*日期右对齐*/
}
.list li a:hover{
color: #336699;
}
</style>
</head>
<body>
<ul class=list>
<li><span>2007年12月21日</span><a href="#">新闻标题01</a></li>
<li><span>2007年12月21日</span><a href="#">新闻标题02</a></li>
<li><span>2007年12月21日</span><a href="#">新闻标题03</a></li>
<li><span>2007年12月21日</span><a href="#">新闻标题04</a></li>
</ul>
注意:span一定要放在前面,反之会产生换行
</body>
</html>

（出处：急速软件下载学院）

纯CSS制作的新闻网站中的文章列表相关文章：
·纯CSS制作的新闻网站中的文章列表
·Excel行列转置粘贴数据的一则实例
·分页列表的网页特效代码
·查看/修改系统或office的安装序列号
·网站被搜索引擎喜欢并排名前列须做的！
·趣闻：关于微软的一系列数字
·思科路由器系列软件安装与升级
·oblog站长访谈系列②：VV博客林林
·SQL Server数据库30步检查安全列表
·SQL Server中行转列问题的终极解决
纯CSS制作的新闻网站中的文章列表相关软件
·京沪爱情列车
·畅游系列之坦克大战
·《冰封王座》地图：台海风系列之海上争霸V1.00
·《星际争霸》战队2V2系列录象包:[Y.H]VS Nexus
·电子竞技原创歌曲系列《醉酒云雾》
·郭小峰探案系列
·名画典藏系列-中国绘画之神仙篇
·《侠盗猎车手：圣安地列斯》35项属性修改器
·格斗类街机《七龙珠英雄列传》模拟器
·SFC 《新SD战国传之大将军列传》模拟器

上一篇:圣诞节日花环花束设计欣赏

下一篇:用十大安全策略加固无线局域网安全

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

纯CSS制作的新闻网站中的文章列表

精品推荐

热点TOP10

特别推荐