版權(quán)說(shuō)明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡(jiǎn)介
1、HTML超文本標(biāo)記語(yǔ)言,一種規(guī)范預(yù)定義,已經(jīng)定義好的各種標(biāo)記,只需要我們把對(duì)應(yīng)的標(biāo)記放到合適的位置一. HTML 基本語(yǔ)法與基本結(jié)構(gòu)(重點(diǎn))標(biāo)記的使用1、標(biāo)記一般成對(duì)出現(xiàn),包含開(kāi)始標(biāo)記和結(jié)束標(biāo)記2、標(biāo)記可以嵌套使用,但是不能交叉使用3、標(biāo)記不區(qū)分大小寫(xiě) 屬性的使用(屬性控制內(nèi)容的格式,額外的格式)1、書(shū)寫(xiě)位置在開(kāi)始標(biāo)記中2、格式:屬性名 =“屬性值”,多個(gè)屬性之間使用空格分割3、不同的標(biāo)記屬性可能相同也可能不同4、屬性使用的標(biāo)記中,只能對(duì)本標(biāo)中的內(nèi)容記產(chǎn)生影響5、屬性不沖突時(shí),效果疊加,屬性沖突時(shí),就近原則html 的基本結(jié)構(gòu)<html>聲明網(wǎng)頁(yè)<head>網(wǎng)頁(yè)的頭部信
2、息<title>標(biāo)題</title>-網(wǎng)頁(yè)的標(biāo)題</head><body>網(wǎng)頁(yè)的主體,網(wǎng)頁(yè)內(nèi)容主要展示的部分網(wǎng)頁(yè)的主要內(nèi)容</body></html>二 . 文本格式的應(yīng)用1、標(biāo)題標(biāo)記 <hn> ,n 的取值 1-6,1 級(jí)標(biāo)題最大效果:加粗顯示,帶有自動(dòng)換行屬性: align 控制標(biāo)題的對(duì)齊方式,取值 left (左對(duì)齊,默認(rèn)值) | center (居中) | right (右對(duì)齊)2、段落標(biāo)記 <p>效果:把內(nèi)容分段展示,自動(dòng)換行屬性:align,控制段落內(nèi)容的對(duì)齊方式,取值left (左對(duì)齊
3、,默認(rèn)值)|center (居中) |right (右對(duì)齊)3、換行符 <br />,單標(biāo)記,不需要結(jié)束標(biāo)記,換行但不分段空格符號(hào):  ;表示一個(gè)空格強(qiáng)制換行符 : <br />4、水平線標(biāo)記 <HR /> ,單標(biāo)記效果:水平線,默認(rèn)是一個(gè)粗細(xì)為 2px (像素)的線條屬性: size 控制水平線的粗細(xì),取值為整數(shù),單位為像素(px)width 控制水平線的長(zhǎng)度,取值可以是像素單位,也可以是百分?jǐn)?shù)(相對(duì)于 瀏覽器窗口百分比)noshade 設(shè)置水平線不帶有陰影,該屬性不需要取值color 設(shè)置水平線的顏色,取值可以是英文的顏色值,也可以是十六
4、進(jìn)制的 顏色代碼align 控制水平線的對(duì)齊方式,取值left(左對(duì)齊)|center (居中,默認(rèn)值)|right(右對(duì)齊)5、分節(jié)標(biāo)記 <div>效果:把內(nèi)容設(shè)置為一節(jié),前后帶有自動(dòng)換行屬性:align控制div中內(nèi)容的對(duì)齊方式,取值 left (左對(duì)齊,默認(rèn)值)|center (居 中)| right (右對(duì)齊)6、居中標(biāo)記符 <center>效果:把 center 標(biāo)記中的內(nèi)容居中顯示7、文本控制標(biāo)記 <font>效果:控制字體的各種顯示樣式屬性:size 控制字體的大小,取值為絕對(duì)值時(shí),1-7,數(shù)字越大字體越大,取相對(duì)值時(shí),參考的是默認(rèn)字體 (3號(hào)
5、),取值在 -2-+4 之間color 控制字體的顏色face 控制字體的字體,取值可以是多個(gè)值,多個(gè)值之間使用逗號(hào)分割,取值 時(shí)從左往右依次取值,找到合適的值為止,假如都不支持,使用默認(rèn)格式顯示8、字體的物理樣式加粗: <b>斜體: <i>下劃線: <u>刪除線: <s>上標(biāo): <sup>下標(biāo): <sub>1、常用邏輯字符<ADDRESS>網(wǎng)頁(yè)設(shè)計(jì)者或維護(hù)者的信息,通常顯示為斜體<CITE>表示文本屬于引用,通常顯示為斜體<CODE>? 表示程序代碼,通常顯示為固定寬度字體<DF
6、N>? 表示定義了的術(shù)語(yǔ),通常顯示為黑體或斜體<EM>強(qiáng)調(diào)某些字詞,通常顯示為斜體<KBD>表用戶的鍵盤(pán)輸入,通常顯示為固定寬度字體<SAMP>表示文本樣本,通常顯示為固定寬度字體<STRONG>特別強(qiáng)調(diào)某些字詞,通常顯示為粗體<VAR>表示變量,通常顯示為斜體2、列表標(biāo)記1、有序列表,ol,需要配合li標(biāo)記使用一個(gè)li標(biāo)記對(duì)應(yīng)一個(gè)選項(xiàng)ol 的屬性: type 控制列表的符號(hào)樣式,取值 1|A|a|i|I ,默認(rèn)是 1start控制列表的起始值,取值為任意的整數(shù)li 的屬性: type 控制選項(xiàng)自身的符號(hào)樣式,取值 1|A|a|
7、i|Ivalue 控制選項(xiàng)本身的起始值, 取值為任意整數(shù), 但是修改自身起始值之后,會(huì)對(duì)同一個(gè)列表中本選項(xiàng)之后的同級(jí)li標(biāo)記產(chǎn)生影響2、無(wú)序列表,ul,配合li標(biāo)記使用一個(gè)li標(biāo)記對(duì)應(yīng)一個(gè)選項(xiàng)ul的屬性:type控制所有選項(xiàng)的符號(hào)樣式,取值disc (實(shí)心圓,默認(rèn)值)|circle (空心圓)|square (方塊)li 的屬性: type 控制選項(xiàng)本身的符號(hào)樣式li 標(biāo)記用在 ol 中, type 屬性的取值跟 ol 的 type 屬性取值走,用在 ul 中,跟著ul 的 type 屬性取值走3、定義列表,Vdl>,完成對(duì)定義列表的聲明<dt>,術(shù)語(yǔ)標(biāo)記,可以理解為類(lèi)似于列
8、表選項(xiàng)的標(biāo)題使用<dd>,描述標(biāo)記,可以理解為類(lèi)似于列表的選項(xiàng)使用三. 在網(wǎng)頁(yè)中使用圖片標(biāo)記:<img>,單標(biāo)記,不需要結(jié)束標(biāo)記屬性: src引入圖片資源的路徑絕對(duì)路徑:資源在服務(wù)器上的位置,該位置是從盤(pán)符出發(fā)相對(duì)路徑:資源在服務(wù)器上的相對(duì)位置,從網(wǎng)頁(yè)本身出發(fā)返回上一層文件夾width 控制顯示圖片的寬度,取值為像素或者百分?jǐn)?shù)height 控制顯示圖片的高度,取值為像素或者是百分?jǐn)?shù)只設(shè)置寬度或高度時(shí),圖片保持等比縮放,同時(shí)設(shè)置時(shí),同時(shí)生效border 控制顯示圖片的邊框,取值為像素,默認(rèn)不顯示邊框hspace 控制顯示圖片水平方向上的空白,取值為像素vspace 控制顯
9、示圖片垂直方向上的空白,取值為像素align 控制圖片和周?chē)谋镜膶?duì)齊方式垂直方向上 :top 文本和圖片頂部對(duì)齊bottom 文本底部和圖片底部對(duì)齊middle 文本的底部和圖片的中部對(duì)齊absmiddle 絕對(duì)中間對(duì)齊,文本的中部和圖片的中部對(duì)齊水平方向上: left 圖片在左,文本在右right 文本在左,圖片在右圖片的對(duì)齊方式:借助<div>或者vp>四 . 在網(wǎng)頁(yè)中使用超鏈接4、超鏈接標(biāo)記:<a>v/a>,通過(guò)鏈接跳轉(zhuǎn)到新的資源屬性: href 鏈接的目標(biāo)資源的路徑鏈接外部資源時(shí),一定是絕對(duì)路徑,并且需要在路徑前加上【http:/ 】 這個(gè)網(wǎng)絡(luò)通信
10、協(xié)議target 指定超鏈接的打開(kāi)方式, _self 在自身的頁(yè)面打開(kāi)超鏈接 (默認(rèn)的打開(kāi)方式 ), _blank 重新打開(kāi)一個(gè)新的瀏覽器窗口建立錨點(diǎn)(書(shū)簽)內(nèi)部書(shū)簽1、 設(shè)置錨點(diǎn)的名稱(chēng)例如:<a name="錨點(diǎn)名">.v/a>2、使用超鏈接完成跳轉(zhuǎn) 例如:va href="#錨點(diǎn)名">.</a>外部書(shū)簽1、 設(shè)置錨點(diǎn)的名稱(chēng)例如:<a name="錨點(diǎn)名">.</a>2、使用超鏈接完成跳轉(zhuǎn) 例如:<a href二"錨點(diǎn)所在頁(yè)面的路徑#錨點(diǎn)名">
11、;.v/a>超鏈接發(fā)送電子郵件,格式<a href二"mailto:郵箱地址">發(fā)送郵件</a>2、鏈接多媒體五. 表格的應(yīng)用表格的結(jié)構(gòu)vtable>-聲明表格vcaption>.v/caption>-表格的標(biāo)題vtr>表格的行<td></td>- 表格的列</tr><tr>表格的行<td></td>- 表格的列</tr></table>之間<table>標(biāo)記,定義表格,所有表格的內(nèi)容書(shū)寫(xiě)在 <table&g
12、t;開(kāi)始和</table>結(jié)束標(biāo)記屬性: frame 控制表格最外層的四個(gè)邊框取值: void 默認(rèn)值,不顯示邊框above 僅顯示上邊框below 僅顯示下邊框hsides 顯示上下邊框vsides 顯示左右邊框lhs 僅顯示左邊框rhs 僅顯示右邊框box、 border 顯示四個(gè)邊框rules 控制表格內(nèi)部分割線取值: none 默認(rèn)值,不顯示rows 顯示行分割線cols 顯示列分割線all 顯示所有分割線bordercolor 控制邊框的顏色border 控制表格的所有邊框,取值為像素cellspacing 控制單元格與單元格之間的空白,取值為像素cellpadding
13、控制單元格內(nèi)容和單元格邊框之間的空白,取值 為像素width 設(shè)置單元格的寬度,取值為像素或者百分?jǐn)?shù)height 設(shè)置單元格的高度,取值為像素或者百分?jǐn)?shù)alig n 控制表格的對(duì)齊方式,取值left(默認(rèn)值)|ce nter|rightbgcolor 設(shè)置表格的背景色background 設(shè)置表格的背景圖當(dāng)背景色和背景圖同時(shí)設(shè)定時(shí),優(yōu)先使用背景圖vcaption表格的標(biāo)題,必須書(shū)寫(xiě)在table之間屬性:align 控制表格標(biāo)題的位置,取值top(標(biāo)題在表格的頂部)| bottom (標(biāo)題在表格的底部)tr 定義表格的行屬性: align 控制整行單元格內(nèi)容的水平對(duì)齊方式,取值left (默認(rèn)值
14、,缺省值) | center|rightvalign 控制整行單元格內(nèi)容的垂直對(duì)齊方式, 取值 top|middle (默認(rèn)值) | bottom height 設(shè)置行的高度,取值為像素bgcolor 設(shè)置行的背景色background 設(shè)置行的背景圖bordercolor 設(shè)置行的邊框顏色<td> 列標(biāo)記<th>列標(biāo)題標(biāo)記都可以作為列使用,<th>列標(biāo)題標(biāo)記,內(nèi)容有加粗顯示的效果,并且?guī)в凶詣?dòng)居中屬性: align 控制單元格內(nèi)容的水平方向?qū)R方式,取值 left|center|rightvalign 控制單元格內(nèi)容的垂直方向?qū)R方式, 取值 top|mi
15、ddle (默認(rèn)值) |bottomheight 設(shè)置單元格的高度, 取值以像素為單位, 當(dāng)同一行中不同的單元格設(shè) 置的高度也不相同時(shí),整行的高度取值按最大值來(lái)width 設(shè)置單元格的寬度,取值以像素為單位,當(dāng)同一列中不同行的單元格設(shè)置的寬度不相同時(shí),整列的寬度取值按最大值來(lái)bgcolor 設(shè)置單元格的背景色bakground 設(shè)置單元格的背景圖rowspan 合并行colspan 合并列合并行和合并列的取值都是整數(shù),合并幾個(gè)單元格取值就是幾六 . 框架的應(yīng)用1、框架框架集標(biāo)記vframeset,在原有的 html結(jié)構(gòu)基礎(chǔ)上,vframeset替換了 vbody 的位置,換句話說(shuō), vfram
16、eset禾口 body不能共存,只能出現(xiàn)一個(gè)屬性:rows設(shè)置橫向框架的數(shù)量和高度,框架的數(shù)量取決于rows屬性的取值 個(gè)數(shù),每個(gè)框架的高度取決于值的大小cols設(shè)置縱向框架的數(shù)量和寬度,框架的數(shù)量取決于 cols屬性的取值個(gè)數(shù),每個(gè)框架的寬度取決于值的大小rows 和 cols 的取值方式1、像素值2、百分?jǐn)?shù)3、比例取值rows 和 cols 取值,可以有多個(gè)值,值與值之間使用逗號(hào)分割,并且不能有空格 格, cols 和 rows 屬性一般不同時(shí)設(shè)定,要想實(shí)現(xiàn)頁(yè)面的縱向和橫向分割,可以使用框架 的嵌套來(lái)實(shí)現(xiàn)frameborder 使用在 frameset 中,可以控制框架集下的所有框架邊框是
17、否 顯示框架標(biāo)記 <frame /> ,單標(biāo)記屬性: src 引入目標(biāo)資源的路徑name 給框架起名字,需要配合超鏈接的 target 屬性來(lái)使用,達(dá)到鏈接目 標(biāo)框架的目的frameborder 控制框架的邊框是否顯示, 0 表示不顯示 ,1 顯示默認(rèn)的 3D 邊框scrolli ng 控制框架是否加入滾動(dòng)條,取值yes(加入滾動(dòng)條,需要時(shí)加入)|no(不加入滾動(dòng)條)iauto(需要時(shí)加入滾動(dòng)條,默認(rèn)值 )noresize 固定框架的邊框,該屬性不需要取值marginheight 在框架中顯示內(nèi)容時(shí),控制內(nèi)容和框架上下邊框之間的空白,取值以像素為單位,以上邊框?yàn)闇?zhǔn)marginwid
18、th 在框架中顯示內(nèi)容時(shí),控制內(nèi)容和框架左右邊框之間的空白,取值以像素為單位,以左邊框?yàn)闇?zhǔn)<noframes> 當(dāng)瀏覽器不支持框架時(shí),顯示的替換內(nèi)容,必須包含一對(duì)<body>標(biāo)記使用七、表單的應(yīng)用表單1表單標(biāo)記<form>,表單不能嵌套使用,所有表單的內(nèi)容必須書(shū)寫(xiě)在表單的開(kāi)始標(biāo)記和 結(jié)束標(biāo)記之間表單結(jié)構(gòu):<form><input type= ”text ”> 單行文本格式<input type= ”password”> 密碼輸入框<input type= ”checkbox”> 復(fù)選框格式vinput type
19、二"radio” name二”sex”>單選框格式vin put type= ” submit ”提交的格式<in put type= "reset” 重置格式vinput type= ”button ”>自定義格式vselect>下拉菜單格式vopti on> 漢族 v/opti on>vopti on> 滿族 v/opti on>vopti on> 壯族 v/opti on>vopti on> 土家族 v/opti on>v/select>vtextarea >cols="50"
溫馨提示
- 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 酒店品牌推廣總結(jié)
- 軟件行業(yè)采購(gòu)管理心得
- 手機(jī)數(shù)碼銷(xiāo)售員工作總結(jié)
- 金融規(guī)劃行業(yè)財(cái)務(wù)規(guī)劃培訓(xùn)體驗(yàn)
- 云南省昆明市九縣區(qū)人教版(PEP)2023-2024學(xué)年六年級(jí)上學(xué)期英語(yǔ)期末質(zhì)量檢測(cè)試卷
- 2021年廣東省中山市公開(kāi)招聘警務(wù)輔助人員輔警筆試自考題1卷含答案
- 2022年四川省自貢市公開(kāi)招聘警務(wù)輔助人員輔警筆試自考題1卷含答案
- 2021年江蘇省蘇州市公開(kāi)招聘警務(wù)輔助人員輔警筆試自考題1卷含答案
- 2023年浙江省紹興市公開(kāi)招聘警務(wù)輔助人員輔警筆試自考題1卷含答案
- 簡(jiǎn)單辭職報(bào)告怎么寫(xiě)
- 噴塑特殊過(guò)程能力確認(rèn)記錄1
- 高一物理必修一思維導(dǎo)圖
- 錨索張拉和鎖定記錄表
- 2016年校本課程--------合唱教案1
- 【原創(chuàng)】《圓柱與圓錐》復(fù)習(xí)課教教學(xué)設(shè)計(jì)
- 《中國(guó)藥典》規(guī)定中藥飲片用量
- 國(guó)網(wǎng)合肥供電公司城市新建住宅小區(qū)電力建設(shè)實(shí)施細(xì)則
- 初中物理元件實(shí)物圖及一些常用圖形
- 中小學(xué)生備戰(zhàn)期末迎接期末考試動(dòng)員班會(huì)PPT
- 房測(cè)之友BMF用戶說(shuō)明書(shū)
- 國(guó)自然模板(空白版)
評(píng)論
0/150
提交評(píng)論