【自己建设公司网站】
列表嵌套把主页分为多个层次,给人以很强的层次感。有序列表和无序列表不仅可以自身嵌套,而且彼此可互相嵌套。
【案例4-8l在无序列表中嵌套有序列表。
【案例展示】本例文件4-8.html在浏览器中显示的效果如图4-12所示。
【学习目标】掌握有序列表和无序列表互相嵌套的方法。
【知识要点】通过有序列表和无序列表的嵌套实现多层次页面。
·59·
<head>
<meta charset‘gb2312”>
<title>在无序列表中嵌套有序列表</title>
</head>
<body>
<h3>手机按国家年度销量</h3>
<ul type=”square”> <!一无序列表一>
<li>美国产手机
<ol> <!..嵌套有序列表..>
<li>美亚(8000万)
<li>菲亚(7500万)
</ol>
<li>中国产手机
<ol type=”a”> <!一嵌套有序列表一>
<li>环宇(7000万)
<li>天宇(6000万)
<li>丰宇(5000万)
</ol>
</ul>
</body>
</html>
习题4
1.简述HTML5文档的基本结构。
2.使用文字与段落标签制作如图4-13所示的网页。
3.制作如图4-14所示的图文混排网页。
图4-13题2图