【自己建設公司網站】
列表嵌套把主頁分為多個層次,給人以很強的層次感。有序列表和無序列表不僅可以自身嵌套,而且彼此可互相嵌套。
【案例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圖