DIV CSS实例教程：一款清新风格的CSS新闻列表制作
需积分: 33 131 浏览量
2010-02-07
21:44:01
上传
评论
收藏 41KB DOCX 举报
今天我们说说一款新闻列表的制作。新闻列表是一个网站的重要组成元素。我们会经常遇到它，如何处理
他的外观显得尤为重要。这个实例中，我们将标题与日期作单独的浮动，而且在链接的鼠标悬停时，呈现
出不同的色彩变化。而且我们控制 LI 的背景，让其也产生一些交互。总体上的效果还不错。大家可以看
看下面的图片：
XHTML 代码很简单，就是一个无序列表，不过我们对标题和时间设置了不同的 CLASS 以方便控制。
Example Source Code [www.52css.com]
<ulid="pagelist">
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
文字</span><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
标题的文字标题的文字标题的文字</span><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
</span><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题</spa
n><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
字</span><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
文字</span><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
标题的文字标题的文字标题的文字</span><spanclass="ldt">2007-08-06</span></a></li>
<li><ahref="#"><spanclass="lbt">这里是相关文字标题的文字这里是相关文字标题的文字
</span><spanclass="ldt">2007-08-06</span></a></li>
资源评论
