HTML初級(jí)知識(shí)點(diǎn)總結(jié),最詳細(xì)的總結(jié)_第1頁(yè)
HTML初級(jí)知識(shí)點(diǎn)總結(jié),最詳細(xì)的總結(jié)_第2頁(yè)
HTML初級(jí)知識(shí)點(diǎn)總結(jié),最詳細(xì)的總結(jié)_第3頁(yè)
HTML初級(jí)知識(shí)點(diǎn)總結(jié),最詳細(xì)的總結(jié)_第4頁(yè)
HTML初級(jí)知識(shí)點(diǎn)總結(jié),最詳細(xì)的總結(jié)_第5頁(yè)
已閱讀5頁(yè)，還剩8頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶(hù)提供并上傳，收益歸屬內(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ì)齊，默認(rèn)值）

3、 |center （居中） | right （右對(duì)齊）3、換行符<br /> ,單標(biāo)記，不需要結(jié)束標(biāo)記，換行但不分段空格符號(hào) ： &nbsp ;表示一個(gè)空格強(qiáng)制換行符： <br />4、水平線(xiàn)標(biāo)記<HR />,單標(biāo)記效果：水平線(xiàn)，默認(rèn)是一個(gè)粗細(xì)為2Px （像素）的線(xiàn)條屬性： size 控制水平線(xiàn)的粗細(xì)，取值為整數(shù)，單位為像素（ px）width 控制水平線(xiàn)的長(zhǎng)度，取值可以是像素單位，也可以是百分?jǐn)?shù)（相對(duì)于瀏覽器窗口百分比）noshade 設(shè)置水平線(xiàn)不帶有陰影，該屬性不需要取值color 設(shè)置水平線(xiàn)的顏色，取值可以是英文的顏色值，也可以是十六進(jìn)制的顏色

4、代碼align 控制水平線(xiàn)的對(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í)，參考的是

5、默認(rèn)字體（ 3 號(hào)） ，取值在-2-+4 之間color 控制字體的顏色face 控制字體的字體，取值可以是多個(gè)值，多個(gè)值之間使用逗號(hào)分割，取值時(shí)從左往右依次取值，找到合適的值為止，假如都不支持，使用默認(rèn)格式顯示8、字體的物理樣式加粗：<b>斜體：<i>下劃線(xiàn)：<u>刪除線(xiàn)：<s>上標(biāo)：<suP>下標(biāo)：<sub>網(wǎng)頁(yè)設(shè)計(jì)者或維護(hù)者的信息，通常顯示為斜體表示文本屬于引用，通常顯示為斜體表示程序代碼，通常顯示為固定寬度字體 表示定義了的術(shù)語(yǔ)，通常顯示為黑體或斜體 強(qiáng)調(diào)某些字詞，通常顯示為斜體 表用戶(hù)的鍵盤(pán)輸入，通常顯示為固定寬

6、度字體 表示文本樣本，通常顯示為固定寬度字體 特別強(qiáng)調(diào)某些字詞，通常顯示為粗體 表示變量，通常顯示為斜體1、常用邏輯字符<ADDRESS><CITE><CODE><DFN><EM><KBD><SAMP><STRONG><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|

7、A|a|i|I value 控制選項(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、定義列表，dl,完成對(duì)定義列表的聲明dt,術(shù)語(yǔ)標(biāo)記，可以理解為類(lèi)似于列表選項(xiàng)的標(biāo)題使

8、用dd,描述標(biāo)記，可以理解為類(lèi)似于列表的選項(xiàng)使用三 . 在網(wǎng)頁(yè)中使用圖片標(biāo)t己：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 控制顯示圖片垂直方向上的空白，取值為像素ali

9、gn 控制圖片和周?chē)谋镜膶?duì)齊方式垂直方向上 ： top 文本和圖片頂部對(duì)齊bottom 文本底部和圖片底部對(duì)齊middle 文本的底部和圖片的中部對(duì)齊absmiddle 絕對(duì)中間對(duì)齊，文本的中部和圖片的中部對(duì)齊水平方向上： left 圖片在左，文本在右right 文本在左，圖片在右圖片的對(duì)齊方式：借助<div>或者<p>四 . 在網(wǎng)頁(yè)中使用超鏈接4、超鏈接標(biāo)t己：<a>.</a>,通過(guò)鏈接跳轉(zhuǎn)到新的資源屬性： href 鏈接的目標(biāo)資源的路徑鏈接外部資源時(shí)，一定是絕對(duì)路徑，并且需要在路徑前加上【 http:/ 】 這個(gè)網(wǎng)絡(luò)通信協(xié)議target 指

10、定超鏈接的打開(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)名”>.</a>2、使用超鏈接完成跳轉(zhuǎn)例如：<a href="#錨點(diǎn)名">.</a>外部書(shū)簽1、設(shè)置錨點(diǎn)的名稱(chēng)例如：<a name="f點(diǎn)名">.</a>2、使用超鏈接完成跳轉(zhuǎn) 例如：<a href+錨點(diǎn)所在頁(yè)面的路徑#錨點(diǎn)名">.</a>超

11、鏈接發(fā)送電子郵件，格式 <a href="mailto: 郵箱地址">發(fā)送郵件</a>2、鏈接多媒體五 . 表格的應(yīng)用表格的結(jié)構(gòu)<table>-聲明表格<caption>.</caption> -表格的標(biāo)題<tr>表格的行<td></td> -表格的列</tr><tr>表格的行<td></td> -表格的列</tr></table>table記，定義表格，所有表格的內(nèi)容書(shū)寫(xiě)在table開(kāi)始和/table結(jié)束標(biāo)

12、記之間屬性： frame 控制表格最外層的四個(gè)邊框取值： void 默認(rèn)值，不顯示邊框above 僅顯示上邊框below 僅顯示下邊框hsides 顯示上下邊框vsides 顯示左右邊框lhs 僅顯示左邊框rhs 僅顯示右邊框box、 border 顯示四個(gè)邊框rules 控制表格內(nèi)部分割線(xiàn)取值： none 默認(rèn)值，不顯示rows 顯示行分割線(xiàn)cols 顯示列分割線(xiàn)all 顯示所有分割線(xiàn)bordercolor 控制邊框的顏色border 控制表格的所有邊框，取值為像素cellspacing 控制單元格與單元格之間的空白，取值為像素cellpadding 控制單元格內(nèi)容和單元格邊框之間的空白，取

13、值為像素width 設(shè)置單元格的寬度，取值為像素或者百分?jǐn)?shù)height 設(shè)置單元格的高度，取值為像素或者百分?jǐn)?shù)align 控制表格的對(duì)齊方式，取值left（默認(rèn)值）|center|rightbgcolor 設(shè)置表格的背景色background 設(shè)置表格的背景圖當(dāng)背景色和背景圖同時(shí)設(shè)定時(shí)，優(yōu)先使用背景圖caption表格的標(biāo)題，必須書(shū)寫(xiě)在table之間屬性：align控制表格標(biāo)題的位置，取值top（標(biāo)題在表格的頂部）| bottom （標(biāo)題在表格的底部）<tr> 定義表格的行 屬性： align 控制整行單元格內(nèi)容的水平對(duì)齊方式，取值 left （默認(rèn)值，缺省值） | center|

14、rightvalign 控制整行單元格內(nèi)容的垂直對(duì)齊方式， 取值 top|middle （默認(rèn)值） | bottomheight 設(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|middle（ 默認(rèn)值）|botto

15、mheight 設(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)記<frameset>,在原有的html結(jié)構(gòu)基礎(chǔ)上，<frameset>換了<body>的位置，換句話(huà)說(shuō)，<fra

16、meset>ffi<body>t,只能出現(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)框架的目的1 顯示默認(rèn)的frameborder 控制框架的邊框是否顯示， 0 表示不顯示3D 邊框scrolling 控制框架是否加入滾動(dòng)條，取值yes（加入滾動(dòng)條，需要時(shí)加入）ino（不加入滾動(dòng)條）| auto（需要時(shí)加入滾動(dòng)條，默認(rèn)值）noresize 固定框架的邊框，該屬性不需要取值marginheight 在框架中顯示內(nèi)容時(shí)，控制內(nèi)容和框架上下邊框之間的空白，取值以像素為單位，以上邊框?yàn)闇?zhǔn)margi

18、nwidth 在框架中顯示內(nèi)容時(shí)，控制內(nèi)容和框架左右邊框之間的空白，取值以像素為單位，以左邊框?yàn)闇?zhǔn)<noframes> 當(dāng)瀏覽器不支持框架時(shí)，顯示的替換內(nèi)容，必須包含一對(duì) <body>標(biāo)記使用七、表單的應(yīng)用表單1.表單標(biāo)t己<form>,表單不能嵌套使用，所有表單的內(nèi)容必須書(shū)寫(xiě)在表單的開(kāi)始標(biāo)記和結(jié)束標(biāo)記之間表單結(jié)構(gòu)：<form><input type= " tex單行文本格式<input type=” password ”>密碼輸入框<input type=" checkboM選植格式 <inpu

19、t type= " radio " name單WeX§式<input type=" submt交的格式<input type=" reset <input type= " button定義格式<select>下拉菜單格式<option> 漢族 </option><option> 滿(mǎn)族 </option><option> 壯族 </option><option> 土家族</option></select><textarea >cols="50" rows="4"> 請(qǐng)多多指教 多

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶(hù)所有。
  • 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ì)用戶(hù)上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶(hù)上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶(hù)因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論