设计网页中的自定义列表

  • 2019-09-02 15:36:09
  • 阅读次数:
  • 作者:盈岚科技小编
  • 来源:http://www.lyjtt.cn

顾名思义,自定义列表就是以自定义形式定义的列表。在HTML中自定义列表用<dl>标签表示,在网页设计中,<dl>标签中包含<dt>标签和<dd>标签,一个

<dt>标签对应多个或者一个<dd>标签。HTML结构如下:

<dl>    

<dt>自定义列表标题</dt>    

<dd>自定义列表内容</dd>

</dl>

或者:

<dl>    

<dt>自定义列表标题</dt>    

<dd自定义列表内容></dd>    

<dd>自定义列表内容</dd>

</dl>

也可以是一组自定义列表项目:

<dl>    

<dt>自定义列表标题</dt>    

<dd>自定义列表内容</dd>    

<dt>自定义列表标题</dt>    

<dd>自定义列表内容</dd>    

<dd>自定义列表内容</dd>

<dd>自定义列表内容</dd>

</dl>

无论是以哪种形式,都应该注意下面几个问题:   

•<dl>标签必须与<dt>标签相邻,<dd>标签需要相对于一个<dt>标签。  

•<dl>、<dt>、<dd> 3个标签之间不允许出现其他标签。   

•标签必须是成对出现,嵌套要合理。<dl>标签是自定义列表集合,<dt>是自定义列表标题,<dd>是自定义列表的内容,因此在网站建设时自定义列表<dl>标签一般都出现在名词性解释的信息中。

【示例】当需要介绍花圃中花的种类时,就可以采用自定义列表的形式。

<div class="flowers">    

<h1>花圃中的花</h1>

<dl>        

<dt>玫瑰花</dt>        

<dd>玫瑰花,一名赤蔷薇,为蔷薇科落叶灌木。茎多刺。花有紫、白两种,形似蔷被和月季。一般用作蜜饯、糕点等食品的配料。花瓣、根均作药用,入药多用紫玫瑰。</dd>        

<dt>杜鹃花</dt>        

<dd>中国十大名花之一。在所有观赏花木之中,称得上花、叶兼美,地栽、盆栽皆宜,用途最为广泛的。白居易赞曰:“闲折二枝持在手,细看不似人间有,花中此物是西施,鞭蓉芍药皆嫫母”。在世界杜鹃花的自然分布中,种类之多、数量之巨,没有一个能与中国匹敌,中国,乃世界杜鹃花资源的宝库!今江西、安徽、贵州以杜鹃为省花,定为市花的城市多达七八个,足见人们对杜鹃花的厚爱。杜鹃花盛开之时,恰值杜鹃鸟啼之时,古人留下许多诗句和优美、动人的传说,并有以花为节的习俗。杜鹃花多为灌木或小乔木,因生态环境不同,有各自的生活习性和形状。最小的植株只有几厘米高,呈垫状,贴地面生。最大的高达数丈,巍然挺立,蔚为壮观。</dd>    

</dl>

</div>

制作网页时,一般列表信息需要添加一个标题,自定义列表<dl>中的内容主要是通过自定义列表的标题和内容让阅读者明白该列表介绍的信息。当向他人介绍花圃中花的品种时,先说明主题,其次再分别介绍花的种类以及针对不同种类的花进行详细的介绍。

当前文章标题:设计网页中的自定义列表

当前URL:http://www.lyjtt.cn/news/wzzz/3087.html

上一篇:列表信息中的有序列表

下一篇:如何在网页设计中定义列表样式

网站建设、网络营销咨询专线:181-8386-5875(点击可一键拨号)