最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
用DIV+CSS实现网页排版中新闻列表的制作方法
时间:2022-07-02 12:48:44 编辑:袖梨 来源:一聚教程网
CSS代码:
代码如下 | 复制代码 |
.list{ margin: 0px 10px 20px; text-align: left; } .list ul{ list-style-type: none; margin: 0px; padding: 0px; } .list li{ background: url(/news/images/line.gif) repeat-x bottom; /*列表底部的虚线*/ width: 100%; } .list li a{ color: #777777; display: block; padding: 6px 0px 4px 15px; background: url(/news/images/dot.gif) no-repeat 0 6px; /*列表左边的箭头图片*/ } .list li span{ float: right;/*使span元素浮动到右面*/ text-align: right;/*日期右对齐*/ } .list li a:hover{ color: #336699; background: url(/news/images/dot2.gif) repeat-x bottom; } |
注意:span一定要放在前面,反之会产生换行
XHTML:
代码如下 | 复制代码 |
|
相关文章
- 人们熟悉的寄居蟹属于以下哪种分类 神奇海洋11月21日答案 11-21
- 第五人格11.22共研服有什么更新 11月22日共研服更新内容介绍 11-21
- 原神恰斯卡怎么培养 11-21
- 无期迷途四星装束是谁 11-21
- 王者荣耀帝丹高中校服怎么获得 11-21
- 光遇姆明季后续版本怎么玩 11-21