HTML學習筆記03 常用標籤

2021-10-17 23:17:53 字數 3378 閱讀 3810

影象標籤和路徑

注釋和特殊字元

實列:記住每個標籤的語義

標題標籤

h , head縮寫

重要性依次遞減

>

- >

六級標籤

特點

每個標題獨佔一行

文字被放大

段落標籤

分段必須要用段落標籤

段落之間有較大空隙

會根據視窗大小自動換行

>

p>

換行標籤
/>

可以不加/

>

單標籤,break的縮寫,意為打斷,強制換行

特點:單標籤

行與行之間,間距比較小

文字格式化標籤

粗體、斜體、下劃線等

>

加粗標籤strong

>

>

加粗標籤b

>

>

傾斜標籤em

>

>

傾斜標籤i

>

>

刪除線標籤del

>

>

刪除線標籤s

>

>

下劃線標籤ins

>

>

下劃線標籤u

>

特殊標籤

沒有語義,就是盒子,用來布局

div 單獨佔一行,大盒子

span 在一行顯示,小盒子

>

盒子div>

>

盒子 span

>

//這是乙個塊級,定義了文件的區域

style

="color

:#0000ff

">

>

這個標題

h3>

>

和這個段落是相同的style

p>

div>

//這定義的是乙個內聯元素

>

我的母親有

style

="color

:blue

">

藍色span

>

的眼睛。p

>

影象標籤

src 是的屬性,指定影象檔案的路徑和檔名

src=

"影象url"

注意事項

可以寫多個屬性,但是必須寫到img影象標籤後面,以空格隔開

屬性採取鍵值對的格式,即key= 「value」的格式,屬性等於「屬性值」

目錄資料夾和根目錄

**,用資料夾1作為目錄資料夾,資料夾1內即為根目錄

用vscode便於管理

路徑相對於html頁面的位置

超連結標籤

超連結標籤的語法格式

href

="跳轉目標"

target

=「目標視窗的彈出方式」

>

超連結標籤的文字或影象 a

>

a是anchor的縮寫,意味錨

內部鏈結

在目錄資料夾中跳轉

href

="跳轉目標是本地資料夾的檔名"

target

=「目標視窗的彈出方式」

>

超連結標籤的文字或影象 a

>

空鏈結 :用#號代替,代開發未建立時使用

href

="#"

target

=「目標視窗的彈出方式」

>

空鏈結 a

>

將檔案做成壓縮包,如果在根目錄,直接寫檔名即可

href

="img.zip"

>

>

網頁元素超連結

href

="鏈結位址"

>

src=

"**位址"

>

a>

錨點鏈結

在頁面內跳轉,快速導航至目標文字等

href

="#two"

>

第二集a

>

給目標標籤新增id屬性

"two"

>

第二集內容

h2>

注釋標籤

ctrl + /  新增注釋

特殊字元

//宣告為html5 文件 (不區分大小寫)

//元素是 html 頁面的根元素

//元素包含了文件的元(meta)資料

"utf-8"

>

//定義網頁編碼格式為 utf-8。

菜鳥教程(runoob.com)

<

/title>

//元素描述了文件的標題

<

/head>

//包含了可見的頁面內容

/h1>

//定義乙個大標題

我的第乙個段落。<

/p>

//定義乙個段落

<

/body>

<

/html>

前端學習筆記,HTML常用標籤02

table是 th用於表示,的標題 th的用法和td一樣 tr用於表示行 乙個table標籤 有幾個tr,表示有幾行 td表示列 乙個tr裡有幾個td,表示有幾列 table標籤屬性 border 1 設定 邊框的寬度為1pixel 畫素 width 500 設定 寬度為500pixel heigh...

Web前端學習筆記 HTML常用標籤

文字標題標籤 h1 h6 特點 有預設樣式 文字會加粗 字型大小不一樣 h2 h6 板塊的標題 一段敘述性文字的標題。注 h1 h6 不能互相巢狀 文字的加粗 文字的傾斜 加粗 語義化 表示強調 傾斜 下劃線 水平線 換行符 下劃線 水平線 換行符 段落標記 一般用來放一段敘述性文字。注 p標籤不能...

html 03 HTML常用標籤以及路徑選擇

第01階段.前端基礎.html常用標籤 應用 首先 html和css是兩種完全不同的語言,我們學的是結構,就只寫html標籤,認識標籤就可以了。不會再給結構標籤指定樣式了。html標籤有很多,這裡我們學習最為常用的,後面有些較少用的,我們可以查下手冊就可以了。排版標籤主要和css搭配使用,顯示網頁結...