CSS用dl定义列表实现冒号后折行

1,814 Comments

在写武大讲座网的讲座信息详情时,对于冒号后折行的问题,折腾了许久~  写下来,分享下~

效果图:

dl1

查看演示
HTML
<!--CTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt-->
 
 
 
<div class="lecture_info">
 
<dl class="speaker">
 
<dt>主讲人:
</dt><dd>巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶巫世晶
</dd></dl>
 
 
<dl class="time">
 
<dt>时 间:
</dt><dd>2010-11-22日2010-11-22日2010-11-22日2010-11-22日2010-11-22日2010-11-22日2010-11-22日2010-11-22日2010-11-22日
</dd></dl>
 
 
<dl class="place">
 
<dt>地 点:
</dt><dd>文理学部教五楼文理学部教五楼文理学部教五楼文理学部教五楼文理学部教五楼文理学部教五楼文理学部教五楼文理学部教五楼
</dd></dl>
 
 
</div>
 
 

More