来看看：CSS实例教程:制造网页特别产物列表
你可以将许多网页的风格格式同时更新，不用再一页一页地更新了。破洛洛文章简介：我们一般的做法是，把日期写在span标签里，然后把span标签写在li里，css界说span(float:right)，让span浮动在列表的右侧。
克日，被同事问及一个产物列表的做法怎样完成？一个产物列表，每一个产物列表前面跟一个button，这些button居右对齐。
实在这个效果跟旧事列表是相似的，我们经常必要做如许的旧事列表效果：
我们一般的做法是，把日期写在span标签里，然后把span标签写在li里，css界说span(float:right)，让span浮动在列表的右侧。
css部分:
body{font-size:12px}
ul{width:400px;margin:0;padding:0;list-style:none}
.newslist{line-height:20px;padding:5px0;color:#333;border-bottom:1pxdashed#ccc}
.newslistspan{color:#888;float:right;text-align:right}
a{color:#333;text-decoration:none}
a:hover{color:blue;text-decoration:underline}
html部分:
<ul>
<liclass="newslist">·<ahref="#">10%无责补偿仍存交强惊</a><span>2008-11-28</span></li>
</ul>
我们一样平常的逻辑做法都是把<span>日期</span>写在旧事列表的前面。实在否则，我们应当把<span>日期</span>放在旧事列表的后面。至于为何要如许做，我还没找到很好的注释。
准确的做法：
<ul>
<liclass="newslist"><span>2008-11-28</span>·<ahref="#">10%无责补偿仍存交强惊</a></li>
</ul>
全体代码：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>无题目文档</title>
<styletype="text/css">
<!--
body{font-size:12px}
ul{width:400px;margin:0;padding:0;list-style:none}
.newslist{line-height:20px;padding:5px0;color:#333;border-bottom:1pxdashed#ccc}
.newslistspan{color:#888;float:right;text-align:right}
a{color:#333;text-decoration:none}
a:hover{color:blue;text-decoration:underline}
-->
</style>
</head>
<body>
<ul>
<liclass="newslist"><span>2008-11-28</span>·<ahref="#">10%无责补偿仍存交强惊</a></li>
<liclass="newslist"><span>2008-11-28</span>·<ahref="#">百张奥运揭幕式门票赠予年夜发表！</a></li>
<liclass="newslist"><span>2008-11-28</span>·<ahref="#">出游买保险，赢好礼，蓝牙耳机、野餐包等你来拿！</a></li>
<liclass="newslist"><span>2008-11-28</span>·<ahref="#">10%无责补偿仍存交强惊</a></li>
<liclass="newslist"><span>2008-11-28</span>·<ahref="#">五周年绚丽好礼举动中奖名单第2期</a></li>
</ul>
</body>
</html>
层叠样式表（CascadingStyleSheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。 足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓。 HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器） 技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。 只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。 所见则所得网页编辑器的优点就是直观性，使用方便，容易上手. 还是在Dreamweaver所见即所得添加链接是，可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。 只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。
页:
[1]