版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)
文檔簡介
I
表
■
?無杼擊列表
——序列表
—有序列表
?列表的酸步
2012-8-28SchoolSoochowUniversity2
無杼擊列表
?無標(biāo)志列表
-指所要排列的內(nèi)容前后并無一定次序，在使
用時并不需要進(jìn)行特別的組織，而且列表前
面不需要特定的標(biāo)志符號，如數(shù)字等.
?創(chuàng)建無標(biāo)志列表的方法
-＜br＞標(biāo)記
-＜dl＞...v/dl＞標(biāo)記和vdt＞或者vdd＞標(biāo)記的組
合
2012-8-28SchoolofAppliedTechnologySoochowUniversity
另杼擊列表
利用vbr>標(biāo)記創(chuàng)建無標(biāo)志列表
<html>
<head>
<body>
vhl>流行快訊v/hl><!-創(chuàng)建標(biāo)題樣式->
<fontsize=4color="#000080”>
劉德華武漢演唱會取消vbr>
超女冠軍昨晚決出vbr>
</font>
</body>
<html>
2012-8-28SchoolofAppliedTechnologySoochowUniversity
二
I
vbr＞創(chuàng)建無標(biāo)志列表效果
2012-8-28SchoolofAppliedTechnologySoochowUniversity5
利用v(H＞…v/dl＞和vdt＞標(biāo)記創(chuàng)建無標(biāo)記列表
<html>
<body>
vh2>流行快訊v/h2><!-創(chuàng)建標(biāo)題樣式->
<dl><fontsize=3color=u#000080,,>
vdt>劉德華武漢演唱會取消
vdt>超女冠軍昨晚決出
</font>
</dl>
</body>
<html>
2012-8-28SchoolofAppliedTechnologySoochowUniversity6
Vdl＞…v/dl＞和Vdt＞組合效果
2012-8-28SchoolofAppliedTechnologySoochowUniversity7
利用＜dl＞...v/dl＞和vdd＞標(biāo)記創(chuàng)建無標(biāo)記列表
<html>
<body>
vh3>流行快訊v/h3><!-創(chuàng)建標(biāo)題樣式->
<dl><fontsize=2color=66#000080,,>
vdd>劉德華武漢演唱會取消
vdd>超女冠軍昨晚決出
</font>
</dl>
</body>
<html>
2012-8-28SchoolofAppliedTechnologySoochowUniversity8
二
I
..
1：vdl＞…v/dl＞和vdd＞組合效果
21?
2012-8-28SchoolofAppliedTechnologySoochowUniversity9
石杼會列表Ji吉
?vbr＞標(biāo)記，不會產(chǎn)生縮進(jìn)
?＜dl＞...v/dl＞和vdt＞組合,不會產(chǎn)生縮進(jìn)
?vdl＞…v/dl＞和vdd＞組合，會產(chǎn)生帶縮進(jìn)
的列表
2012-8-28SchoolofAppliedTechnologySoochowUniversity10
有杼擊列忐
?無序列表
-指列表前面有圓圈等類似的標(biāo)志，但這些列
表之間并沒有什么順序，只是為了使得每個
條目更加醒目。
?有序列表
-指列表前面存在數(shù)字或者英文字母等有順序
的標(biāo)志，表示這些列表之間存在一定的前后
順序。這樣不但使得列表更加醒目，而且表
明了列表之間的順序關(guān)系。
2012-8-28SchoolofAppliedTechnologySoochowUniversity11
..........麥左.烈盛.............
,創(chuàng)建考限
-<ul>.......v/ul>和vli>組合。
-格式：
?<ul>
-<li>第一個列表
-<li>第二個列表
?</ul>
-注意：Qi>是單標(biāo)記，即一個一個表項的開始,就是
前一個表項的結(jié)束.
2012-8-28SchoolofAppliedTechnologySoochowUniversity12
<
.
一
二.......為感理奏.........
三?羌屋加裝那總
二-列表項目作為一個整體，與上下段文本間各
二有一行空白;表項向右縮進(jìn)并左對齊,每行前
二面有項目符號。每個表項左端的項目符號
二可為disc（實心圓點）、circle（空心圓
二點）、square（方塊），也可為圖像。
二
-例如
一<ultype="disc”>
二
二<ultype=^graphl.giP>
一2012-8-28SchoolofAppliedTechnologySoochowUniversity13
」
無序列表應(yīng)用示例
<html>
vhead>vtitle>無序列表v/title>v/head>
<body>
<palign=left><fontcolor=bluesize=4>
vb>流行快訊v/b>v/funt>v/p>
<ul>
<litype="circle"/U德華武漢演唱會取消
<litype="square”>超女冠軍昨晚決出
<litype="disc”>劉翔昨晚再獲冠軍
</ul>
</body>
SchoolofAppliedTechnologySoochowUniversity
無序列表效果
2012-8-28SchoolofAppliedTechnologySoochowUniversity15
無序列表強音事項
?用Vlll＞和4i＞兩個標(biāo)簽可以設(shè)計出想到整
齊的文本段。
,不推薦使用vul＞和vli＞來開發(fā)網(wǎng)頁。
?一般推薦使用段落vp＞或分區(qū)顯示vdiv＞
顯示標(biāo)記來格式化文本。
2012-8-28SchoolofAppliedTechnologySoochowUniversity16
二
I
I:單列表
w:1受前裹...................................
□：單列表是比較常用的無序列表，它往往用
■：于列出幾個相關(guān)網(wǎng)頁的索引，以便通過超鏈接
來很快選取感興趣的內(nèi)容。
工?格式為：
二.<menu>
q：<ih〉選單列表的標(biāo)題
二：Qi〉第一個列表項
二〈廿〉第二個列表項
.?</menu>
,2012-8-28SchoolofAppliedTechnologySoochowUniversity17
二
I
單列表應(yīng)用示例
?<html>
?<headxtitle>單歹U表應(yīng)用示例</titleX/head>
?<body>
.<menu>
?<lhXfontsize=4>網(wǎng)頁設(shè)計過程
?</fontX/ln>
:<Li>打開編輯軟代
:<li>輸入HTML語言
?<li>保存文件
?<li>用瀏覽器瀏覽
.</menu>
:</body>
?</html>
2012-8-28SchoolofAppliedTechnologySoochowUniversity18
1:有序列表
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
,：?創(chuàng)建有序列表
4?-通過帶序號的列表可以更清楚地表達(dá)信息的順序。使用〈。1〉
二:標(biāo)記可以建立有序列表，表項的標(biāo)記為<li>
，??格式為：
2^9<oi>
J?<li〉第一個列表項
音,<li〉第二個列表項
一?</ol>
一：*在瀏覽器中顯示時，有序列表整個表項與上下段之間
??各有一行空白，列表項目向右縮進(jìn)并左對齊，各表項
■?前帶序號。
H?
,2012-8-28SchoolofAppliedTechnologySoochowUniversity19
二
I
有序列表應(yīng)用示例
<html>
<head><title>W序列表v/title>v/head>
<body>
<palign=left><fontcolor=bluesize=4>
vb>專業(yè)設(shè)置v/b>v/funt>v/p>
<ol>
vli>計算機應(yīng)用
4i>計算機軟件
4i>計算機圖形學(xué)
</ol>
</body>
</html>
2012-8-28SchoolofAppliedTechnologySoochowUniversity20
有序列表應(yīng)用示例效果
2012-8-28SchoolofAppliedTechnologySoochowUniversity21
有序列表
改變有序列表中的序號種類
-利用<。1〉或Gi>中的type屬性可設(shè)定5種序號：數(shù)字、大小寫
英文字母、大小寫羅馬字母。默認(rèn)序號為數(shù)字。
-在〈。1〉指定的符號樣式，影響其所有序列表。
-格式為：—TypeNumberingstyle
序號》
<oltype=1arabicnumbers1,2,3,
<litype=序號,aloweralpha與bja
—例如：AupperalphaAB,J.
ilowerromani,ii,iii,…
nnMn
<oltype=istart=4></ol>Iupperromaiti,n,m,
?type="i"：設(shè)定數(shù)目款式，其值有五
種，請參考右表，內(nèi)定為type="l"。
?start="4?：設(shè)定開始數(shù)目，不論設(shè)定了哪一數(shù)目款式，其
值只能是等整數(shù)，內(nèi)定為start=nlno
2012-8-28SchoolofAppliedTechnologySoochowUniversity22
列表的愛步
-列表嵌套把主頁分為多個層次，例如書的
目錄，給人以很強的層次感。
嵌套方式：-
-自身列表嵌套
-混合嵌套
2012-8-28SchoolofAppliedTechnologySoochowUniversity23
<
.
一e多列表就布（1）
二
三?嵌套無標(biāo)志列表
二<html>
vheadxtitle>列表嵌套的應(yīng)用</title></head>
二
<bodytext=navy>
二vh4>使用標(biāo)記<dt>產(chǎn)生無標(biāo)志列表嵌套v/h4>
<
二dl><!--最外層標(biāo)記-->
vdt>在歌曲庫中增加周惠的《約定》——2004.4.21
二
vdt>新增林憶蓮的《至少還有你》----2000.4.21
二vdl>王菲金曲：<!-第二層標(biāo)記->
<dt>《明月幾時有》
二
<dl><!-第三層標(biāo)記->
:vdt>年度最佳歌曲
二
vdt>當(dāng)月排行榜第一
二?
vdt>MTV制作最佳作品
二?
?</dl><!-第三層標(biāo)記結(jié)束->
2012-8-28SchoolofAppliedTechnologySoochowUniversity24
二一
I
&多列表愛布(1)
<dt>《棋子》
<dt>《天空》
<dt>《愛哭鬼》
v/dl><!”第—?層標(biāo)記結(jié)束-->
vdt>動力火車火爆金曲一2000.4.25
v/dl><!—第一1層標(biāo)記結(jié)束-1>
</body>
</html>
一2012-8-28SchoolofAppliedTechnologySoochowUniversity25
二
I
43列表就布（1）歿果
文件《日編輯也）查看（y）收藏（獨工具（D幫助（a）
◎總會◎搜索山收藏夾金媒體J二_V3，@
地址9）區(qū)1Dg.HTML
-3-網(wǎng)頁-MP3-立即搜索-②攔翻▼|令工a▼3網(wǎng)站導(dǎo)航▼包j松注
使用標(biāo)記<d?產(chǎn)生的標(biāo)志列表嵌套
在歌曲庫中增加周惠的《約定》-----2004.4.21
新增林憶蓮的《至少還有你》——2000.4.21
王菲金曲：
《明月幾時有》
年度最佳歌曲
當(dāng)月排行榜第一
MTV制作最佳作品
《棋子》
《天空》
《爰哭鬼》
動力火車火爆荃曲一2000.4.25
，由完畢自我的電腦
;拿開蛤|MlG3傘多,A本地磁盤?：）j?]Chap2-5Html語言…|②UltraEda>32.[D:\br....11苞3列表嵌套的應(yīng)用-…!桌面》三《?區(qū)cJ暮黑國13:27
2012-8-28SchoolofAppliedTechnologySoochowUniversity26
<
.
一e多列表愛布（2）
二
三?嵌套有標(biāo)志的無序列表
二<html>
列表的嵌套
二<head><title>Wv/title>v/head>
<bodytext=navy>
二vh4>使用標(biāo)記<ul><H>產(chǎn)生的標(biāo)志列表嵌套v/h4>
二<ul>最外層標(biāo)記
vli>在歌曲庫中增加周惠的《約定》----2004.4.21
二
vli>新增林憶蓮的《至少還有你》----2000.4.21
二<ul>王菲金曲：<!—第二層標(biāo)記—>
《明月幾時有》
二<li>
<ul><!-第三層標(biāo)記->
:vli>年度最佳歌曲
二
vli>當(dāng)月排行榜第一
二?
vli>MTV制作最佳作品
二?
?</ul><!-第三層標(biāo)記結(jié)束->
2012-8-28SchoolofAppliedTechnologySoochowUniversity27
二一
I
&多列表愛布(2)
<li>《棋子》
<li>《天空》
<li>《愛哭鬼》
v/ul><!―.第—^層標(biāo)記結(jié)束-->
vli>動力火車火爆金曲一2000425
v/ul><!--第一1層標(biāo)記結(jié)束—>
</body>
</html>
?說明：
-有標(biāo)志列表嵌套時，使用vul>、4i>組合標(biāo)記會自動產(chǎn)生帶有
方框、圓圈等標(biāo)志的列表效果
2012-8-28SchoolofAppliedTechnologySoochowUniversity28
43列表成布(2)歿果
2012-8-28SchoolofAppliedTechnologySoochowUniversity29
<
.
一e多列表愛布（3）
二
三?嵌套有標(biāo)志的有序列表
二<html>
列表的嵌套
二<head><title>Wv/title>v/head>
<bodytext=navy>
二vh4>使用標(biāo)記<ul><H>產(chǎn)生的標(biāo)志列表嵌套v/h4>
二<ol><!--最外層標(biāo)記-->
vli>在歌曲庫中增加周惠的《約定》----2004.4.21
二
vli>新增林憶蓮的《至少還有你》----2000.4.21
二<oltype=a>王菲金曲：<!—第二層標(biāo)記—>
《明月幾時有》
二<li>
<oltype=i><!—第三層標(biāo)記
:vli>年度最佳歌曲
二
vli>當(dāng)月排行榜第一
二?
vli>MTV制作最佳作品
二?
?</ol><!-第三層標(biāo)記結(jié)束->
2012-8-28SchoolofAppliedTechnologySoochowUniversity30
二一
I
&多列表愛布(3)
<li>《棋子》
<li>《天空》
<li>《愛哭鬼》
v/ol><!--第—?層標(biāo)記結(jié)束—>
vli>動力火車火爆金曲一2000425
v/ol><!--用一'層標(biāo)記結(jié)束—>
</body>
</html>
一2012-8-28SchoolofAppliedTechnologySoochowUniversity31
二
I
43列表就布（3）歿果
等有列表的冰套-MicrosoftInternetExplorer
文件（日編輯《0查看過）收藏（㈤工具（D和助比）
J畫H◎搜索」收藏夾W媒體3/，3?二］0口
地址（0>隹）Dg.HTML三］談轉(zhuǎn)到|鏈盤叫俺.
習(xí)阿頁-MP3立即搜索▼②攔截▼?工具.3巴站導(dǎo)航二J3）標(biāo)注
使用標(biāo)記<。1><li>產(chǎn)生的標(biāo)志列表嵌套
1.在歌曲庫中增加周惠的《約定》----2004.4.21
新增林憶蓮的《至少還有你》——-2000.4.21
王菲金曲：
《明月幾時有》
i.年度最佳歌曲
ii.當(dāng)月徘行榜第一
ii-MTV制作最佳作品
《快子》
《天空》
《爰哭鬼》
動力火車火爆金曲一2000.4.25
總完畢國我的電腦
3B開始|0日⑨發(fā)》?》本地磁盎9：）I篁］Chap2-5Html語百|(zhì)②Ut"aEdit-32-R:\br…巷］有列表的嵌套-Mtcr...，桌面>>與弋。網(wǎng)運;二9G氧B313:56
2012-8-28SchoolofAppliedTechnologySoochowUniversity32
<
.
一泯合牽
二It
三?混合嵌套
二<html>
列表的嵌套
二<head><title>Wv/title>v/head>
<bodytext=navy>
二vh4>使用標(biāo)記<ul><H>產(chǎn)生的標(biāo)志列表嵌套v/h4>
二<ol><!--最外層標(biāo)記-->
vli>在歌曲庫中增加周惠的《約定》----2004.4.21
二
vli>新增林憶蓮的《至少還有你》----2000.4.21
二<oltype=a>王菲金曲：<!—第二層標(biāo)記—>
《明月幾時有》
二<li>
<ul><!-第三層標(biāo)記->
:vli>年度最佳歌曲
二
vli>當(dāng)月排行榜第一
二?
vli>MTV制作最佳作品
二?
?</ul><!-第三層標(biāo)記結(jié)束->
2012-8-28SchoolofAppliedTechnologySoochowUniversity33
二一
I
泯合It牽
<li>《棋子》
<li>《天空》
<li>《愛哭鬼》
v/ol><!--第—?層標(biāo)記結(jié)束—>
vli>動力火車火爆金曲一2000425
v/ol><!--用一'層標(biāo)記結(jié)束—>
</body>
</html>
一2012-8-28SchoolofAppliedTechnologySoochowUniversity34
二
I
閽合成步效果
的藉I-?-r
:拿開始IHe3
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 2024版銷售經(jīng)理崗位聘用協(xié)議范例版
- 專業(yè)培訓(xùn)及技術(shù)咨詢服務(wù)協(xié)議（2024年度）
- 二零二五年度數(shù)據(jù)中心機房設(shè)備安裝工程一切險保險協(xié)議3篇
- 專屬2024房產(chǎn)中介代理協(xié)議范例版B版
- 2025年度高新技術(shù)產(chǎn)業(yè)園區(qū)廠房租賃管理協(xié)議范本4篇
- 2025年度柴油運輸合同涉及多式聯(lián)運及無縫銜接4篇
- 專業(yè)服務(wù)協(xié)議草案（2024年修訂版）版B版
- 2025年度茶葉產(chǎn)業(yè)鏈金融服務(wù)合作協(xié)議8篇
- 2025年度城市綠道場地平整與生態(tài)景觀合同4篇
- 2025年度廠房建筑安全防護設(shè)施承包合同4篇
- 2023年浙江省公務(wù)員考試面試真題解析
- GB/T 5796.3-2022梯形螺紋第3部分：基本尺寸
- GB/T 16407-2006聲學(xué)醫(yī)用體外壓力脈沖碎石機的聲場特性和測量
- 簡潔藍(lán)色科技商業(yè)PPT模板
- 錢素云先進(jìn)事跡學(xué)習(xí)心得體會
- 道路客運車輛安全檢查表
- 宋曉峰辣目洋子小品《來啦老妹兒》劇本臺詞手稿
- 附錄C（資料性）消防安全評估記錄表示例
- 噪音檢測記錄表
- 推薦系統(tǒng)之協(xié)同過濾算法
- 提高筒倉滑模施工混凝土外觀質(zhì)量QC成果PPT
評論
0/150
提交評論