一、HTML的結(jié)構(gòu)

在禹會(huì)等地區(qū)，都構(gòu)建了全面的區(qū)域性戰(zhàn)略布局，加強(qiáng)發(fā)展的系統(tǒng)性、市場前瞻性、產(chǎn)品創(chuàng)新能力，以專注、極致的服務(wù)理念，為客戶提供成都網(wǎng)站制作、成都網(wǎng)站設(shè)計(jì)、外貿(mào)營銷網(wǎng)站建設(shè) 網(wǎng)站設(shè)計(jì)制作按需定制,公司網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),成都品牌網(wǎng)站建設(shè),網(wǎng)絡(luò)營銷推廣,成都外貿(mào)網(wǎng)站建設(shè),禹會(huì)網(wǎng)站建設(shè)費(fèi)用合理。

這是頁面的內(nèi)容

二、在HTML中，一般來說，只有6個(gè)標(biāo)簽?zāi)茏屇芊旁趆ead標(biāo)簽內(nèi)。

注：

1.link標(biāo)簽：用于引入外部樣式文件（CSS文件）

2.meta標(biāo)簽：定義頁面的特殊信息，例如頁面關(guān)鍵字、頁面描述等。

①name屬性

②http-equiv屬性

//定義頁面所使用的編碼；這一句必須放在title標(biāo)簽以及其他meta標(biāo)簽前面

//6秒后刷新當(dāng)前頁面

3.script標(biāo)簽：定義頁面的JavaScript代碼，也可以引入外部JavaScript文件

4.style標(biāo)簽：定義元素的css樣式

三、靜態(tài)頁面和動(dòng)態(tài)頁面

1.靜態(tài)頁面：文字、圖片、超鏈接、音頻和視頻（絕大部分）

2.靜態(tài)頁面和動(dòng)態(tài)頁面的區(qū)別在于：是否服務(wù)器進(jìn)行數(shù)據(jù)交互。

四、一般標(biāo)簽和自閉合標(biāo)簽

1.一般標(biāo)簽：由于有開始符號(hào)和結(jié)束符號(hào)，因此可以在內(nèi)部插入其他標(biāo)簽或文字。

2.自閉合標(biāo)簽：由于只有開始符號(hào)而沒有結(jié)束符號(hào)，因此不可以在內(nèi)部插入標(biāo)簽或文字。所謂的“自閉合”，指的是本來要用一個(gè)配對(duì)的結(jié)束符號(hào)來關(guān)閉，然而它卻“自己”關(guān)閉了。

標(biāo)簽：劃分區(qū)域

五、塊元素和行內(nèi)元素

1.塊元素：在瀏覽器顯示狀態(tài)下將占據(jù)一整行，并且排斥其他元素與其位于同一行。此外，一般情況下，塊元素內(nèi)部可以容納其他塊元素和行內(nèi)元素。

2.行內(nèi)元素：可以與其他行內(nèi)元素位于同一行，只可以容納其他行內(nèi)元素，不可以容納塊元素。

六、網(wǎng)頁中的“空格”

:下標(biāo)?:上標(biāo)

七、列表

1.有序列表（ordered list）

：有前后之分,有序號(hào)

：列表項(xiàng)（ol標(biāo)簽只能配合li標(biāo)簽一起使用，ol標(biāo)簽的子標(biāo)簽只能是li，不能是其他元素）

①type屬性

2.無序列表(unordered list）

：沒有前后之分，無序號(hào)

：列表項(xiàng)（ol標(biāo)簽只能配合li標(biāo)簽一起使用，ol標(biāo)簽的子標(biāo)簽只能是li，不能是其他元素）

①type屬性

（注：我們一般都是使用無序列表，幾乎用不到有序列表。）

3.定義列表(definition list)

：一組帶有特殊含義的列表，一個(gè)列表項(xiàng)包含“條件”和“列表”兩部分

定義名詞（definition term）:

定義描述（definition description）:

八、表格

1.在HTML中，一個(gè)表格一般會(huì)由以下三個(gè)部分組成。

①表格：table標(biāo)簽

②行：tr標(biāo)簽

③單元格：td標(biāo)簽

表格標(biāo)題：caption標(biāo)簽（只能有一個(gè)，位于第一行）

表頭單元格：th標(biāo)簽

注：th和td的區(qū)別

①顯示上：瀏覽器會(huì)以粗體和居中來顯示th標(biāo)簽中的內(nèi)容，但是td標(biāo)簽不會(huì)

②語義上：th標(biāo)簽用于表頭，而td標(biāo)簽用于表行

2.HTML引入thead、tbody和tfoot這三個(gè)標(biāo)簽把表格分為三部分：表頭、表身、表腳。使表格語義更加良好，結(jié)構(gòu)更清晰，也更具有可讀性和可維護(hù)性。還能方便分塊來控制表格的css樣式

3.合并行屬性：rowspan（將縱向的N個(gè)單元格合并）?

合并列：colspan（將橫向的N個(gè)單元格合并）

九、圖片

1.img標(biāo)簽是空標(biāo)簽，它只包含屬性，并且沒有閉合標(biāo)簽。

2.img的屬性

①src屬性：src 指 "source"，源屬性的值是圖像的 URL 地址。

②alt屬性：用于描述圖片，這個(gè)描述文字是給搜索引擎看的，并且當(dāng)圖片無法顯示時(shí)，頁面會(huì)顯示alt中的文字。

③title屬性：也用于描述圖片，不過這個(gè)描述文字是給用戶看的，并且當(dāng)鼠標(biāo)指針移到圖片上時(shí)，會(huì)顯示title中的文字。

④height（高度） 與 width（寬度）屬性用于設(shè)置圖像的高度與寬度。

3.圖片路徑

①絕對(duì)路徑：指的是圖片在電腦中的完整路徑

②相對(duì)路徑：指的是圖片相對(duì)當(dāng)前頁面的路徑

比如：index1.html和img文件夾處于同一目錄下，如果index1.html要引用img文件夾中的1.jpg。則正確的相對(duì)路徑為?img/1.jpg

如果work4.html要引用img文件夾中的2.jpg。則正確的相對(duì)路徑為../img/2.jpg

如果work4.html要引用test文件夾中的3.jpg。則正確的相對(duì)路徑為../3.jpg,因?yàn)閏ode2文件夾和3.jpg位于同一級(jí)目錄中，我們只需要找到work4.html的上一級(jí)，就可以找到3.jpg了

注：../表示上一級(jí)目錄；在實(shí)際開發(fā)中站內(nèi)文件不管是圖片還是超鏈接等，我們都使用相對(duì)路徑，幾乎不會(huì)使用絕對(duì)路徑，這是因?yàn)槿绻W(wǎng)站文件一旦移動(dòng)，則絕大多數(shù)路徑都會(huì)失效。

4.圖片格式

①位圖：“像素圖”，由像素組成的圖片。將位圖放大縮小后，圖片會(huì)失真。

.jpg(或.jpeg)：.jpg格式可以很好地處理大面積色調(diào)的圖片，適合存儲(chǔ)顏色豐富的復(fù)雜圖片，如照片、高清圖片等。此外，.jpg體積較大，并且不支持透明。

.png：.png是一種無損格式，可以無損壓縮以保證頁面打開速度。此外，.png體積較小，并且支持透明，不過不適合存儲(chǔ)顏色豐富的圖片。

.gif：.gif圖片效果最差，不過它適合制作動(dòng)畫。實(shí)際上，小伙伴們經(jīng)常在QQ發(fā)的動(dòng)圖都是.gif格式的

也就是說，如果想要展示色彩豐富而高品質(zhì)圖片，可以使用.jpg格式；如果是一般圖片，為了減少體積或者想要透明效果，可以使用.png格式；如果是動(dòng)畫圖片，可以使用.gif格式。

②矢量圖：“向量圖”，它是用計(jì)算機(jī)圖形學(xué)中點(diǎn)、直線或多邊形等表示出來的幾何圖像。矢量圖大的優(yōu)點(diǎn)是：圖片無論放大、縮小或旋轉(zhuǎn)等都不會(huì)失真。大的缺點(diǎn)是：難以表現(xiàn)色彩豐富的圖片效果（非常差）。

常見格式：.ai .cdf .fh .swf

十、超鏈接

文本超鏈接和圖片超鏈接，都是把文字和圖片放在a標(biāo)簽內(nèi)部來實(shí)現(xiàn)的

內(nèi)部鏈接：自身網(wǎng)站的頁面

錨點(diǎn)鏈接：是內(nèi)部鏈接的一種，它的鏈接地址指向的是當(dāng)前頁面的某個(gè)部分。簡單來說，就是點(diǎn)擊當(dāng)前某一個(gè)超鏈接，然后它就會(huì)跳到“當(dāng)前頁面”某一部分。

需要定義兩個(gè)元素：目標(biāo)元素的id，a標(biāo)簽的href屬性指向該id。

1.a標(biāo)簽

href屬性：表示想要跳轉(zhuǎn)的頁面的路徑

target屬性：定義超鏈接的打開新窗口的方式

注意：一般情況下，我們只會(huì)用到_blank這一個(gè)值?

十一、表單

在HTML中，表單標(biāo)簽有五種：form、input、textarea、select和option。

從外觀上來劃分，表單可以分為以下八種：單行文本框、密碼文本框、單選框、復(fù)選框、按鈕、文件上傳、多行文本框、下拉列表。

1.form標(biāo)簽：我們要把所有表單標(biāo)簽放在form標(biāo)簽內(nèi)部

//各種表單標(biāo)簽

form標(biāo)簽屬性

其中method屬性的兩個(gè)屬性值：

• post：指的是 HTTP POST 方法，表單數(shù)據(jù)會(huì)包含在表單體內(nèi)然后發(fā)送給服務(wù)器，用于提交敏感數(shù)據(jù)，如用戶名與密碼等。

• get：默認(rèn)值，指的是 HTTP GET 方法，表單數(shù)據(jù)會(huì)附加在?action?屬性的 URL 中，并以??作為分隔符，一般用于不敏感信息，如分頁等。例如：https://www.runoob.com/?page=1，這里的 page=1 就是 get 方法提交的數(shù)據(jù)。

2.input標(biāo)簽：在HTML中，大多數(shù)表單都是使用input標(biāo)簽實(shí)現(xiàn)的。

input標(biāo)簽是自閉和標(biāo)簽，它是沒有結(jié)束符號(hào)的。

input標(biāo)簽屬性

①單行文本框

常用屬性

②密碼文本框

常用屬性

③單選框

checked屬性表示默認(rèn)選中，HTML5的最新寫法，checked屬性沒有屬性值

為了得到更好的語義化，表單元素與后面的文本一般都需要借助label標(biāo)簽關(guān)聯(lián)起來。

男女

注：value屬性取值一般跟后面的文本相同，之所以加上value屬性，是為了方便JavaScript或者服務(wù)器操作數(shù)據(jù)。所有表單元素的value屬性的作用都是一樣的。

④復(fù)選框

checked屬性表示默認(rèn)選中

注：復(fù)選框中的name跟單選框中的name都是用來設(shè)置“組名”的，表示該選項(xiàng)位于哪一組中。
兩者都設(shè)置name屬性，為什么單選框只能選中一項(xiàng)，而復(fù)選框可以選擇多項(xiàng)呢？其實(shí)這是因?yàn)闉g覽器會(huì)自動(dòng)識(shí)別這是“單選框組”還是“復(fù)選框組”（其實(shí)就是根據(jù)type屬性取值來識(shí)別）。如果是單選框組，就只能選擇一項(xiàng)；如果是復(fù)選框組，就可以選擇多項(xiàng)。
如果想在默認(rèn)情況下，讓復(fù)選框某幾項(xiàng)選中，我們也可以使用checked屬性來實(shí)現(xiàn)。

⑤按鈕

在HTML中，常見的按鈕有三種：普通按鈕button、提交按鈕submit、重置按鈕reset

value取值就是按鈕上的文字

普通按鈕、提交按鈕以及重置按鈕的區(qū)別。
普通按鈕一般情況下都是配合JavaScript來進(jìn)行各種操作的。
提交按鈕一般都是用來給服務(wù)器提交數(shù)據(jù)的；
重置按鈕一般用來清除用戶在表單中輸入的內(nèi)容。

⑥文件上傳

3.textare標(biāo)簽

多行文本框:默認(rèn)內(nèi)容

4.select標(biāo)簽和option標(biāo)簽

下拉列表由select和option這兩個(gè)標(biāo)簽配合使用

select標(biāo)簽常用屬性

注：默認(rèn)情況下，下拉列表只能選擇一項(xiàng)，我們可以通過multiple屬性設(shè)置下拉列表可以選擇多項(xiàng)。想要選取多項(xiàng)，可以使用“Ctrl+鼠標(biāo)左鍵”來選取。

有些小伙伴將size取值為1、2、3時(shí)，會(huì)發(fā)現(xiàn)在Chrome瀏覽器中無效。這是因?yàn)镃hrome瀏覽器最低是4個(gè)選項(xiàng)，我們只能選取4及以上數(shù)字。

option常用屬性：selected默認(rèn)選中

十一、框架

iframe標(biāo)簽：在HTML中，我們可以使用iframe標(biāo)簽來實(shí)現(xiàn)一個(gè)內(nèi)嵌框架，就是在當(dāng)前頁面嵌入另外一個(gè)網(wǎng)頁。

你是否還在尋找穩(wěn)定的海外服務(wù)器提供商？創(chuàng)新互聯(lián)www.cdcxhl.cn海外機(jī)房具備T級(jí)流量清洗系統(tǒng)配攻擊溯源，準(zhǔn)確流量調(diào)度確保服務(wù)器高可用性，企業(yè)級(jí)服務(wù)器適合批量采購，新人活動(dòng)首月15元起，快前往官網(wǎng)查看詳情吧

分享題目：前端——HTML（二）-創(chuàng)新互聯(lián)
網(wǎng)頁URL：http://www.rwnh.cn/article6/jdiog.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供建站公司、企業(yè)網(wǎng)站制作、品牌網(wǎng)站設(shè)計(jì)、響應(yīng)式網(wǎng)站、網(wǎng)站策劃、外貿(mào)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)