一、HTML的結構

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

這是頁面的內容

二、在HTML中，一般來說，只有6個標簽能讓能放在head標簽內。

注：

1.link標簽：用于引入外部樣式文件（CSS文件）

2.meta標簽：定義頁面的特殊信息，例如頁面關鍵字、頁面描述等。

①name屬性

②http-equiv屬性

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

//6秒后刷新當前頁面

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

4.style標簽：定義元素的css樣式

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

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

2.靜態(tài)頁面和動態(tài)頁面的區(qū)別在于：是否服務器進行數據交互。

四、一般標簽和自閉合標簽

1.一般標簽：由于有開始符號和結束符號，因此可以在內部插入其他標簽或文字。

2.自閉合標簽：由于只有開始符號而沒有結束符號，因此不可以在內部插入標簽或文字。所謂的“自閉合”，指的是本來要用一個配對的結束符號來關閉，然而它卻“自己”關閉了。

標簽：劃分區(qū)域

五、塊元素和行內元素

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

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

六、網頁中的“空格”

:下標?:上標

七、列表

1.有序列表（ordered list）

：有前后之分,有序號

：列表項（ol標簽只能配合li標簽一起使用，ol標簽的子標簽只能是li，不能是其他元素）

①type屬性

2.無序列表(unordered list）

：沒有前后之分，無序號

：列表項（ol標簽只能配合li標簽一起使用，ol標簽的子標簽只能是li，不能是其他元素）

①type屬性

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

3.定義列表(definition list)

：一組帶有特殊含義的列表，一個列表項包含“條件”和“列表”兩部分

定義名詞（definition term）:

定義描述（definition description）:

八、表格

1.在HTML中，一個表格一般會由以下三個部分組成。

①表格：table標簽

②行：tr標簽

③單元格：td標簽

表格標題：caption標簽（只能有一個，位于第一行）

表頭單元格：th標簽

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

①顯示上：瀏覽器會以粗體和居中來顯示th標簽中的內容，但是td標簽不會

②語義上：th標簽用于表頭，而td標簽用于表行

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

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

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

九、圖片

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

2.img的屬性

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

②alt屬性：用于描述圖片，這個描述文字是給搜索引擎看的，并且當圖片無法顯示時，頁面會顯示alt中的文字。

③title屬性：也用于描述圖片，不過這個描述文字是給用戶看的，并且當鼠標指針移到圖片上時，會顯示title中的文字。

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

3.圖片路徑

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

②相對路徑：指的是圖片相對當前頁面的路徑

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

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

如果work4.html要引用test文件夾中的3.jpg。則正確的相對路徑為../3.jpg,因為code2文件夾和3.jpg位于同一級目錄中，我們只需要找到work4.html的上一級，就可以找到3.jpg了

注：../表示上一級目錄；在實際開發(fā)中站內文件不管是圖片還是超鏈接等，我們都使用相對路徑，幾乎不會使用絕對路徑，這是因為如果網站文件一旦移動，則絕大多數路徑都會失效。

4.圖片格式

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

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

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

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

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

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

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

十、超鏈接

文本超鏈接和圖片超鏈接，都是把文字和圖片放在a標簽內部來實現的

內部鏈接：自身網站的頁面

錨點鏈接：是內部鏈接的一種，它的鏈接地址指向的是當前頁面的某個部分。簡單來說，就是點擊當前某一個超鏈接，然后它就會跳到“當前頁面”某一部分。

需要定義兩個元素：目標元素的id，a標簽的href屬性指向該id。

1.a標簽

href屬性：表示想要跳轉的頁面的路徑

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

注意：一般情況下，我們只會用到_blank這一個值?

十一、表單

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

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

1.form標簽：我們要把所有表單標簽放在form標簽內部

//各種表單標簽

form標簽屬性

其中method屬性的兩個屬性值：

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

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

2.input標簽：在HTML中，大多數表單都是使用input標簽實現的。

input標簽是自閉和標簽，它是沒有結束符號的。

input標簽屬性

①單行文本框

常用屬性

②密碼文本框

常用屬性

③單選框

checked屬性表示默認選中，HTML5的最新寫法，checked屬性沒有屬性值

為了得到更好的語義化，表單元素與后面的文本一般都需要借助label標簽關聯起來。

男女

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

④復選框

checked屬性表示默認選中

注：復選框中的name跟單選框中的name都是用來設置“組名”的，表示該選項位于哪一組中。
兩者都設置name屬性，為什么單選框只能選中一項，而復選框可以選擇多項呢？其實這是因為瀏覽器會自動識別這是“單選框組”還是“復選框組”（其實就是根據type屬性取值來識別）。如果是單選框組，就只能選擇一項；如果是復選框組，就可以選擇多項。
如果想在默認情況下，讓復選框某幾項選中，我們也可以使用checked屬性來實現。

⑤按鈕

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

value取值就是按鈕上的文字

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

⑥文件上傳

3.textare標簽

多行文本框:默認內容

4.select標簽和option標簽

下拉列表由select和option這兩個標簽配合使用

select標簽常用屬性

注：默認情況下，下拉列表只能選擇一項，我們可以通過multiple屬性設置下拉列表可以選擇多項。想要選取多項，可以使用“Ctrl+鼠標左鍵”來選取。

有些小伙伴將size取值為1、2、3時，會發(fā)現在Chrome瀏覽器中無效。這是因為Chrome瀏覽器最低是4個選項，我們只能選取4及以上數字。

option常用屬性：selected默認選中

十一、框架

iframe標簽：在HTML中，我們可以使用iframe標簽來實現一個內嵌框架，就是在當前頁面嵌入另外一個網頁。

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

分享題目：前端——HTML（二）-創(chuàng)新互聯
網頁URL：http://aaarwkj.com/article6/jdiog.html

成都網站建設公司_創(chuàng)新互聯，為您提供建站公司、企業(yè)網站制作、品牌網站設計、響應式網站、網站策劃、外貿網站建設

廣告

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