理论教育 网页设计:无序列表标记

网页设计:无序列表标记

时间:2023-11-04 理论教育 版权反馈
【摘要】:建立无序列表可使用<ul>标记和<li>表项标记,其格式为:<ul type=”符号类型"><li type="符号类型1">第一个列表项</li><li type="符号类型2">第二个列表项</li>……</ul>说明:无序列表在浏览器中的显示效果是:列表项目作为一个整体,与上下段文本间各有一行空白;表项向右缩进并左对齐,每行前面有项目符号。图5-6无序列表示例

网页设计:无序列表标记

无序列表中每一个表项的前面是项目符号(如●、■等符号)。建立无序列表可使用<ul>标记和<li>表项标记,其格式为:

<ul type=”符号类型">

<li type="符号类型1">第一个列表项</li>

<li type="符号类型2">第二个列表项</li>

……

</ul>

说明:

(1)无序列表在浏览器中的显示效果是:列表项目作为一个整体,与上下段文本间各有一行空白;表项向右缩进并左对齐,每行前面有项目符号。

(2)type指定每个表项左端的符号类型,可为disc(实心圆点●)、circle(空心圆点○)、square(方块■)。其设置方法有两种:①在<ul type="符号类型">中指定符号的样式;②在<li type="符号类型">中指定符号的样式。

<li type="符号类型">的优先级高于<ul type="符号类型"》。

【例5-6】无序列表应用示例。

在编辑窗口输入下面的代码:

<!--文件名:ex5-6.html-->

<!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=gb2312"/>

<title>名著欣赏</title></head>

<body bgcolor="ivory">

<h3 align="center">中国古代四大名著</h3>

<ul type="circle">(www.daowen.com)

<li>西游记——中国神话小说的经典之作</li>

<li>红楼梦——中国封建社会百科全书</li>

<li>水浒传——中国第一部成熟的白话长篇小说</li>

<li type="square">三国演义——中国第一部长篇历史小说</li>

</ul><hr/>

<h3 align="center">外国名著赏析</h3>

<ul type="disc">

<li>复活——俄国19世纪批判现实主义文学杰作</li>

<li>高老头——巴尔扎克小说创作的高峰</li>

<li>浮士德——欧洲文学四大名著之一</li>

<li>荷马史诗——西方文学史上最优秀最著名的叙事长诗</li>

<li>唐·吉诃德——欧洲现代长篇小说的奠基之作</li>

<li>巴黎圣母院——法国浪漫主义文学杰作</li>

</ul><hr/>

</body>

</html>

在浏览器中的显示效果如图5-6所示。

图5-6 无序列表示例

免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。

我要反馈