应用CSS制作的新闻网站中的文章列表ul是html中的无序列表，li是列表中的列表项。假如没有CSS定义它的外观，它默认是显示成一列列表，并且它会存在项目符号(比如方块或实心的黑点)的列表内容。CSS网页布局中，除了新闻列表、链接运行ul、li制作以外，我们通常将菜单也用ul、li来实现。
以下是引用片段
%26lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"%26gt;
%26lt;html xmlns="http://www.w3.org/1999/xhtml"%26gt;
%26lt;head%26gt;
%26lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312" /%26gt;
%26lt;title%26gt;CSS新闻列表制作webjx.com%26lt;/title%26gt;
%26lt;style type="text/css"%26gt;
.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;
}
%26lt;/style%26gt;
%26lt;/head%26gt;
%26lt;body%26gt;
%26lt;ul class=list%26gt;
%26lt;li%26gt;%26lt;span%26gt;2007年12月21日%26lt;/span%26gt;%26lt;a href="#"%26gt;新闻标题01%26lt;/a%26gt;%26lt;/li%26gt;
%26lt;li%26gt;%26lt;span%26gt;2007年12月21日%26lt;/span%26gt;%26lt;a href="#"%26gt;新闻标题02%26lt;/a%26gt;%26lt;/li%26gt;
%26lt;li%26gt;%26lt;span%26gt;2007年12月21日%26lt;/span%26gt;%26lt;a href="#"%26gt;新闻标题03%26lt;/a%26gt;%26lt;/li%26gt;
%26lt;li%26gt;%26lt;span%26gt;2007年12月21日%26lt;/span%26gt;%26lt;a href="#"%26gt;新闻标题04%26lt;/a%26gt;%26lt;/li%26gt;
%26lt;/ul%26gt;
注重:span一定要放在前面,反之会产生换行
%26lt;/body%26gt;
%26lt;/html%26gt;