9.1 HTML中的dl、dt和dd标记
浏览数：42 /
时间：2015年06月09日
|
本章中，我们将在前面两章的基础上，制作出更为复杂的下拉菜单。当网站的内容比较丰富，结构比较复杂的时候，一级导航的菜单往往就不够用了，这时就需要多级菜单来实现层级结构。实际上任何使用电脑的人对下拉菜单都不会陌生，几乎所有的软件都会通过菜单为用户提供操作的命令接口。 在早期的网站上，制作多级的菜单是件很麻烦的事情，而且不易维护。但是近年来，由于CSS不断普及，使用CSS制作的菜单已经可以非常方便地为网站带来清晰的导航支持。 本案例就来制作一个下拉菜单。图9.1所示为鼠标离开菜单时子菜单未打开的效果，图1所示为一个子菜单打开后的效果。  图1 显示子菜单时的效果 这里介绍一组HTML标记-dl，dt和dd。这组标记不像ul和li标记那么常用，但是用于定义本案例中的结构是非常合适的。 dl、dt、dd这组标记和ul、li非常类似，也用于列表结构。dl被称为“定义列表”(definitionlist)，在使用方法上相当于ul；dt和dd分别称为“定义标题”(definition title)和“定义描述”（definition description），它们在使用方法上相当于li。例如有下面一段HTML代码： 折叠XML/HTML 代码复制内容到剪贴板
在浏览器中的效果如图1所示。可以看到dl相当于u1，dt和dd相当于li．区别在于dt和dd会被区别对待。如果希望菜单具有子菜单，就可以把主菜单的菜单项文字定义为dt，下属于菜单中的菜单项定义为dd。  图1 使用“定义列表” |
| 编辑：网页学习网 |
| 本文地址:http://www.lodidance.com/css/jc/728.html |
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
