html列表、表格和框架.ppt

學(xué)習(xí)目標(biāo),掌握使用html制作列表 掌握使用框架實(shí)現(xiàn)多窗口 掌握使用表格對(duì)網(wǎng)頁(yè)布局,有序列表,使用html制作列表 有序列表 1):格式: 2):編號(hào)屬性 type :列表?xiàng)l目類型,值為 1/A/a/i/I start:列表?xiàng)l目起始值,無(wú)序列表,無(wú)序列表 1):格式: 2):編號(hào)屬性 type :列表?xiàng)l目類型,值為: square:方形 disc :實(shí)心圓 circle:空心圓,定義列表,定義列表 1):格式: 2):格式說(shuō)明: dl:定義列表標(biāo)記 dt:用以標(biāo)志定義條目 dd:用以標(biāo)志定義內(nèi)容,框架,什么是框架 將網(wǎng)頁(yè)分成多個(gè)窗口,每個(gè)窗口由單獨(dú)的網(wǎng)頁(yè)進(jìn)行控制,可以實(shí)現(xiàn)例如導(dǎo)航,聊天室等效果. 基本語(yǔ)法 說(shuō)明: 1):采用框架技術(shù)控制網(wǎng)頁(yè)窗口劃分的網(wǎng)頁(yè)不需要標(biāo)簽，兩者標(biāo)簽對(duì)等 2):cols、 rows是使窗口縱向、橫向排列。有幾個(gè)框架就在其后接幾個(gè)數(shù)字，并分別寫出該框架的行高為多少。當(dāng)然也可寫百分比來(lái)表示框架所占比例（另外，還可以用“*”設(shè)定,代表省略的某個(gè)數(shù)值）,框架,使用框架 縱向排列多個(gè)窗口,框架,橫向排列窗口,框架屬性,框架frame屬性 noresize 默認(rèn)情況下允許改變各窗口大小,可以使用此屬性不允許改變窗口大小 frameborder 可以使用0或者1來(lái)控制是否顯示邊框,0表示無(wú)邊框 framespacing 可以使用framespacing來(lái)控制框架之間的距離 scrolling 可以使用scrolling屬性來(lái)控制是否需要顯示滾動(dòng)條, yes表示一定顯示滾動(dòng)條,no表示一定不顯示滾動(dòng)條,auto表示自動(dòng)根據(jù)實(shí)際情況來(lái)決定是否顯示滾動(dòng)條 marginheight,marginwidth 可以使用marginheight,marginwidth來(lái)控制頁(yè)面與框架間的距離,窗口打開位置,窗口打開位置 框架是將網(wǎng)頁(yè)分成了多個(gè)窗口,所以新打開的鏈接窗口可以控制其打開位置 target屬性 在新窗口打開 在當(dāng)前窗口打開 在父窗口打開 在整個(gè)瀏覽器窗口打開 在指定名稱的框架中打開,浮動(dòng)框架,什么是浮動(dòng)框架 浮動(dòng)框架是在網(wǎng)頁(yè)中插入一個(gè)框架來(lái)顯示另一個(gè)網(wǎng)頁(yè),該標(biāo)記可放置在網(wǎng)頁(yè)中任意位置 基本語(yǔ)法 說(shuō)明:name屬性為框架名稱,主要作為此框架的標(biāo)志,noframes,一般放在卷標(biāo)中，表示其中間部分不用框架顯示。 當(dāng)瀏覽器不支持框架結(jié)構(gòu)時(shí)，可以用來(lái)在其中間插上body卷標(biāo)所需顯示的內(nèi)容，方便用戶使用。 相當(dāng)于框架結(jié)構(gòu)中的不顯示信息。, 文檔主體內(nèi)容 ,表格的基本結(jié)構(gòu),標(biāo)記的含義 定義表格 .定義標(biāo)題顯示在表格外,唯一有效，放在中任意位置均可 . 定義表行 . 定義表頭顯示在表格內(nèi)，等價(jià)于粗體顯示中內(nèi)容，可多項(xiàng) . 定義列(表格的具體內(nèi)容),表格的標(biāo)題,標(biāo)題的標(biāo)記 設(shè)置標(biāo)題及水平對(duì)齊屬性,由caption屬性控制 語(yǔ)法 . ,表格的屬性設(shè)置,表格的對(duì)齊：align=left,center,right設(shè)置表格的位置 表格大?。簑idth=象素值或百分比height=象素值或百分比 表格的邊框?qū)傩裕篵order=象素值 表格邊框顏色：bordercolor=顏色 表格格間線寬（間距）：cellspacing=象素值 表格內(nèi)容與格線距離（填充）：cellpadding=象素值 背景顏色：bgcolor=顏色 背景圖片：background=圖片路徑 格內(nèi)文字的對(duì)齊： 水平對(duì)齊align 垂直對(duì)齊valign=top,middle,bottom（不能用在中，可以用在 、 中 ）,跨多行、多列的表格(1/2),單元格跨越多列： colspan=列數(shù) ,跨多行、多列的表格(2/2),單元格跨越多行： rowspan=行數(shù) ,合并儲(chǔ)存格示例(1/3), ab ab ab 效果圖：,合并儲(chǔ)存格示例(2/3), a ab