html常用的基本標籤

2022-05-29 08:54:10 字數 4289 閱讀 5622

1、

文件型別宣告,讓瀏覽器按照html標準對**進行解釋與執行;文件型別宣告必不可少,而且,必須在文件最上方;如果不寫文件型別宣告,瀏覽器將會預設的相容模式執行,可能會出現不明bug。

2、head標籤主要放置一些關於網頁設計的相關語句

3、設定網頁的字符集編碼格式

常見gb2312:簡體中文編碼格式

gbk:擴充套件的國標碼,比國標碼多了更多的編碼格式

utf-8:萬國碼,它可以基本相容大多數國家語言

html4.01之前,宣告字符集編碼格式

4、設定網頁關鍵字:

name="keywords":表示當前語句用於設定網頁關鍵字

content=表示網頁的關鍵字內容,多個關鍵字之間用英文逗號分開.

5、設定網頁描述

name="description"表示當前語句用於設定網頁描述

網頁的描述,在搜尋引擎中搜尋**時,標題下面的一段文字,就是網頁的描述內容。

6、title:網頁的標題,網頁選項卡上文字

7、link:連線網頁選項卡小圖示

rel屬性選擇icon,表示連線的檔案將作為網頁的icon圖示

href屬性選擇路徑位址

1、body標籤中的內容,會顯示在瀏覽器的展示區域

2、html標籤分為塊級標籤和行級標籤

從功能上分為塊級標籤和行級標籤區別:

1:塊級標籤自動換行,前後隔一行;行級標籤不會換行,從左往右依次顯示。

2:塊級標籤的預設寬度是100%;行級標籤的寬度由文字內容撐開。

3:塊級標籤可以設定寬度、高度、邊距等屬性;行級標籤則不能設定這些屬性。

從寫法上,html標籤分為「成對標籤」和「自閉合標籤」(空標籤)

成對標籤:成對出現,有開始標籤,結束標籤,內容包裹在兩個標籤之間。

例如:自閉合標籤:只有乙個標籤,用/表示標籤的自動閉合(/可以省略),

例如:1、h標籤:標題標籤,預設加粗,h1最大,h6最小。

去吧,小火龍!

去吧,小火龍!

去吧,小火龍!

2、標籤

hr標籤:水平線標籤

3、標籤:段落標籤,表示網頁中的一段文字

這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。這是乙個段落。

4、標籤:換行符號,在**中回車,在網頁中並沒有用,必須使用

斷行。5、

標籤

你好
blockquote標籤:引用標籤,表示標籤中的文字是引用子其他**的內容。

瀏覽器預設顯示效果:整段向後縮排。

cite屬性:表示引用內容的**,常寫引用的**url。

6、

標籤

pre標籤:預格式標籤,與p標籤不同的是,pre標籤會保留**中的空格和回車,在網頁中直接顯示

最常用的作用,是在網頁中顯示**段,保留**段格式。

7、基於布局的塊級標籤

①有序列表:

(order list),乙個有序列表由多個li組成

第一項第二項

第三項

②無序列表:

③定義列表

(define list)包含兩部分dt和dd

定義列表標題,頂格顯示,一般乙個定義列表有乙個標題

定義列表描述項,相對於標題向後縮排顯示,乙個列表可以有很多個描述項。

定義列表標題

定義列表描述項1

定義列表描述項2

定義列表描述項3

④組合標籤

包含兩部分

img:

figcaption:標題顯示在正下方

的標題

⑤分割槽標籤,用於配合css使用。將網頁劃分為區塊,可以包裹各種標籤。

這是div裡的文字

1、標籤:用於包裹行內文字。常配合css使用修改文字樣式。

哈嘍2、常見引用標籤,常見有:blockquote,q,cite

區別:①顯示效果:blockquote整段縮排,q加引號,cite傾斜。

②從功能上:blockquote用於一整段內容,是塊級標籤。q用於引用一句話,是行級標籤,cite常引用於作品名、書名,也是行級標籤。

塊引用
q標籤,短引用,加引號,

cite引用,傾斜,用於作品名引用

3、字型大一號和小一號,已經淘汰,修改字型統一用css。

小一號字型

大一號字型

4、img標籤:

1.src屬性:表示所在路徑。

[路徑表示方式]

①網路位址,並不建議使用。

②的絕對路徑。但是,嚴禁使用據對路徑。因為,絕對路徑使用file://協議,網頁使用http://協議無法訪問file://協議檔案。

file路徑寫法:file:///panfu:/檔案路徑

③使用相對路徑,推薦使用唯一方式。

a.在當前檔案下一層,"資料夾名/名加檔案型別"

b.與當前檔案在同一層,直接寫「名」

c.在當前檔案的上一層,寫"../名"

注意:必須包含在專案裡面,不能超出當前專案根目錄。

2.width和height屬性:寬度和高度

3.title屬性:滑鼠指上是顯示的文字

4.alt屬性:無法載入時,顯示文字,省略alt,將預設顯示title內容

5.align屬性:周圍文字相對於的排列方式,top文字居上center居中bottom居底

1、**中一行用tr表示;一行中的單元格用td表示;首行的表頭每個單元格用th表示,預設文字加粗、居中。

2、**標籤基本屬性

①border:給**的每乙個td和整個table加邊框。如果border的值》1,則只有最外邊框加粗,td不變。

②cellspacing:設定單元格與單元格之間的間距,當數值為0時相鄰的邊框不會合併,顯示兩條線寬度。

設定**邊框合併

可以設定css設定:style="border-collapse: ;"

設定邊框合併以後,cellspacing屬性會失效。

③cellpadding:單元格內邊距,單元格中文字與邊框之間的距離。

④width/height:**寬度高度。

⑤align:設定**在瀏覽器中居左、居中、居右。

⑥bgcolor:**背景色。

⑦bordercolor:**的邊框顏色。

⑧background:**的背景圖。優先順序高於背景色。

3、**的行列屬性

作用與tr和td的屬性

①width/height:**行列寬度高度。

②bgcolor:背景色

當**的屬性與行列屬性發生衝突時,優先順序採用「近者優先」原則:table5、小示例

6、**的結構化

①完整的**結構

caption:**的標題,無論標籤放在**第幾行,**標題永遠在正上方居中

thead:**的表頭部分,永遠在**最上部分

tbody:**的身體部分,永遠在thead之下,tfoot之上

tfoot:**的尾部,永遠在**最下部分

②**的直列化

**有幾列,既可以在**的最上方寫幾個標籤,每個標籤就對應著幾個列,可以對標籤修改樣式、新增name屬性,表示這一列的所有td同步修改

如果,需要對多列共同修改,可以使用標籤包裹多個。

7、示例

**的標題

序號姓名性別1

張三男3李四

男2李花花女

合計

HTML常用基本標籤概覽

ol標籤是乙個有序列表容器 ordered list 會在內部的列表項前面產生數字編號。列表項的順序有意義時,比如排名,就會採用這個標籤。ul標籤是乙個無序列表容器 unordered list 會在內部的列表項前面產生實心小圓點,作為列表符號。列表項的順序無意義時,採用這個標籤。li表示列表項,用...

html的基本基本骨架以及常用標籤

關於html 1 html 全稱 超文字編輯語言 hypertext markup language 2 語法 各種標籤或標記組成 標籤名 dtd 文件型別宣告 h5 告訴瀏覽器其為乙個html頁面 語言為英語 this is a first page body一般放網頁真正顯示的內容 型別宣告4 ...

HTML 基本骨架與常用標籤

超文字 超越文字,在文字內容的基礎上,新增更加豐富是資訊 動畫,聲音等等 title head body html 宣告文件型別 lang en 語言屬性 en是英文 zh cn是中文 charset utf 8 最常用的字符集編碼方式,包含所有國家的語言 titletitle head body ...