定义列表dl是一种特殊的列表形式,dl是definition lists的英文缩写。dl标签是成对出现,以<dl>开始,</dl>结束。列表中每个元素的标题使用<dt>,definition term,后面跟随<dd>,definition description用于描述列表中元素的内容。
定义列表dl在CSS布局中的应用是非常广泛的,只是很多人对此标签非常不熟悉,以至于应用的很少。
为dl标签设置浮动即可啊
范例代码如下(在实际开发当中,记得先引入CSS重置文件,此处只给出的是核心功能代码)
<style>.list {
width: 800px
height: 400px
border: 4px solid black
}
.list dl {
float: left
width: 300px
height: 200px
border: 2px solid red
}
</style>
<div class="list">
<dl>
<dt>自定义列表的标题</dt>
<dd>自定义列表的内容</dd>
</dl>
<dl>
<dt>码匠</dt>
<dd>h5course</dd>
</dl>
</div>
做网页布局之前建议先掌握盒模型、浮动等相关知识。可以借助《HTML5布局之路》等书籍进行系统化的学习。