DL.DT.DD实现左右的布局简单例子

更新时间：2007年12月11日 19:04:23 作者：

<!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=utf-8" /> <title></title> <style> *{ margin:0; padding:0;} #box{ margin:10px; padding:10px; float:left; border:1px solid #CCC; background:#FFFFCC; font-size:12px; line-height:1.9;} dl{ background:#CCCC00; margin:0; width:120px; text-align:center; float:left; margin:5px;} dt{ background:#CC0033;}dt img{display:block; margin:0 auto;} dd{ background:#FFFF00; } </style> </head> <body> <div id="box">   <dl>     <dt> <img src="http://pics.taobao.com/bao/album/promotion/magicbean_070529.gif" /> </dt>     <dd>母亲节-祝福短信</dd>   </dl>   <dl>     <dt> <img src="http://pics.taobao.com/bao/album/promotion/magicbean_070529.gif" /> </dt>     <dd>母亲节-祝福短信</dd>   </dl>   <dl>     <dt> <img src="http://pics.taobao.com/bao/album/promotion/magicbean_070529.gif" /> </dt>     <dd>母亲节-祝福短信</dd>   </dl>   <dl>     <dt> <img src="http://pics.taobao.com/bao/album/promotion/magicbean_070529.gif" /> </dt>     <dd>母亲节-祝福短信</dd>   </dl>   <dl>     <dt> <img src="http://pics.taobao.com/bao/album/promotion/magicbean_070529.gif" /> </dt>     <dd>母亲节-祝福短信</dd>   </dl>   </div> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

我不是十分确定这样的布局是不是合理，但从代码量和结构看还不错。希望有更合理的方面一起交流！

firefox css自动换行的实现方法
越发感觉网页设计人员的辛苦，就一个自动换行，
2008-08-08
HTML5中一些酷炫又有趣的新特性代码整理汇总
HTML5技术结合了HTML4.01的相关标准并革新，符合现代网络发展要求，在2008年正式发布。HTML5并非仅仅用来表示Web内容，它将 Web带入一个成熟的应用平台，在HTML5平台上，视频、音频、图象、动画，以及同电脑的交互都被标准化。
2023-02-02
中文排版CSS心得
中文排版CSS心得...
2007-01-01
多浏览器下IE6 IE7 firefox li 间距问题
多浏览器下IE6 IE7 firefox li 间距问题...
2007-11-11
[转]Accesskey引起的一点点思考
[转]Accesskey引起的一点点思考...
2007-02-02
font和line-height之CSS代码书写顺序不同，导致显示效果不一样
font和line-height之CSS代码书写顺序不同，导致显示效果不一样...
2007-05-05
一个新的CSS菜单代码
一个新的CSS菜单代码...
2007-03-03
html链接与文本标签们
这篇主讲的内容涉及链接、标题、插入、删除、上下标、分割线、换行等标签。
2008-06-06
CSS 美化段落文本之首字下沉
今天要讲的内容是如何实现“首字下沉”，，第一个字是很大的红色楷体，陷于一段文字之首。这种做法在杂志中常见，但是在网页中不那么常见。那么如何实现呢？其实很简单，只有一句CSS就可以了。
2008-07-07
CSS 关于网页图片的属性
其实和跟border的属性一样的东西，做网页的朋友熟练利用下面的样式，就可以做出漂亮的边框效果
2008-09-09