還沒有寫完，後續持續更新

首先來熟悉一下html的基本結構

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>標題</title>

</head>

<body>

這裡是文件的主體

<!--這是一行註釋，註釋不會在瀏覽器中顯示！-->

</body>

</html>

寫在前，定義文件型別，大小寫均可。

html標籤：其作用是告知瀏覽器其自身是一個 HTML 文件。

Head標籤：其作用是定義關於文件的資訊。其中的元素可以引用指令碼、指示瀏覽器在哪裡找到樣式表、提供元資訊

頁面編碼

常用的編碼格式有utf-8和gb2312（中文）, 在標籤內定義

其目的是告知瀏覽器此頁面屬於什麼字元編碼格式

Title標籤：通常放在瀏覽器視窗的標題欄或狀態列上

Body標籤：定義文件的主體，我們所敲得程式碼主要在這裡面

註釋

例：

<!--這是一行註釋-->

用於換行

特殊字元

> 大於號 (>)

< 小於號 (<)

" 引號 (")

“ 左引號 (")

” 右引號 (")

註冊商標()

註冊商標()

版權()

& and（&）

— 破折線（—）

– 短破折線（–）

£ 英鎊（£）

€ 歐元（€）

¥ 日元（¥）

佔位符，表示1個空格，直接敲空格無論連續敲多少個，都只顯示一個空格，用敲幾次就有幾個空格

例

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>特殊符號</title>

</head>

<body>

<p>大於號&gt;</p>

<p>小於號&lt;</p>

<p>引號&quot;</p>

<p>左引號&8220;</p>

<p>右引號&8221;</p>

<p>版權&reg;</p>

<p>註冊商標&8482;</p>

<p>and&amp;</p>

<p>破折線—</p>

<p>短破折線–</p>

<p>英鎊&pound;</p>

<p>歐元€</p>

<p>日元&yen;</p>

<p>十個個空格          直接敲得</p>

<p>十個空格&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;用佔位符表示</p>

</body>

</html>

段落標籤

可以利用align來對段落進行左中右對齊。align的值為left, center, right, justify

其中justify是對行進行伸展，這樣每行都可以有相等的長度

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>段落</title>

</head>

<body>

<P>這是一個最基本的段落</p>

<P align="left">這是一個左對齊的段落</p>

<P align="right">這是一個右對齊的段落</p>

<P align="center">這是一個居中的段落</p>

<center><P>這是一個用&lt;center&gt;居中的段落</p></center>

<P align="justify">每行都可以有相等的長度</p>

<!--感覺justify好像沒有什麼用，那位大佬可以指點一下-->

</body>

</html>

標題。

標題一共有6級，分別為

~

.

從一級至六級，字型依次減小

例：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>標題</title>

</head>

<body>

<h1>這是一級標題</h1>

<h2>這是二級標題</h2>

<h3>這是三級標題</h3>

<h4>這是四級標題</h4>

<h5>這是五級標題</h5>

<h6>這是六級標題</h6>

<!-zhi-->

<p>&nbsp;</p>

</body>

</html>

文字格式

粗體

斜體

^{字的上標

_{字的下標

例：}}

<!doctype html> <html> <head> <meta charset="utf-8"> <title>標題</title> </head> <body> 正常 粗體 斜體 x2 x1 </body> </html>

有序列表

type= disc/circle/square
disc 實心圓點
circle 為空心圓
square 正方形

無序列表

Type=1/a/A/i/I
例：
```

視訊

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

pubg

Ring of Elysium

Cyberpunk 2077

lol

gta

```

超連結

超連結可以是一個字，一個詞，或者一組詞，一幅圖，通過點選這些內容來跳轉到指定的介面，當滑鼠移動到超連結上時，箭頭會變為一隻小手

到達指定網址

 撥打指定電話

 傳送簡訊到指定號碼

 向指定郵箱傳送電子郵件

 訪問指定伺服器

 訪問指定伺服器

例：

<!doctype html> <html> <head> <meta charset="utf-8"> <title>超連結</title> </head> <body> <a href="https://www.cnblogs.com/yphnb/">歡迎訪問我的部落格</a> <a href="https://www.cnblogs.com/yphnb/" target="_blank">歡迎訪問我的部落格</a>  <a href="tel:110">報警電話</a> <a href="sms: 110">傳送簡訊到指定號碼</a>  <a href = "mailto:[email protected]">給我發電子郵件</a> <a href = "ftp://伺服器IP地址或域名">訪問指定伺服器</a> <a href = "telnet://伺服器IP地址或域名">訪問指定伺服器</a> <!-zhi-->   </body> </html>

錨點

#號不能省略！

例：

<!doctype html> <html> <head> <meta charset="utf-8"> <title>錨點</title> </head> <body> <center> 點選以下按鈕，直達歌詞目錄 <a href="#maodian0">My Heart Will Go On</a>  <a href="#maodian1">Bohemian Rhapsody</a> <a href="#maodian2">Call Me Maybe</a> <a name="maodian0"><h3>My Heart Will Go On</h3></a>  Every night in my dreams I see you I feel you That is how I know you go on Far across the distance And spaces between us. You have come to show you go on Near far, wherever you are I believe that the heart does go on Once more, you open the door, And you're here in my heart. And my heart will go on and on Love can touch us one time. And last for a lifetime And never let go till we're gone, Love was when I loved you One true time I hold to. In my life we'll always go on. Near far, wherever you are I believe that the heart does go on Once more, you open the door, And you're here in my heart, And my heart will go on and on You're here, You're here, there's nothing I fear. And I know that my heart will go on we'll stay forever this way. You are safe in my heart, and my heart will go on and on     <a name="maodian1"><h3>Bohemian Rhapsody </h3></a> Is this the real life Is this just fantasy Caught in a landslide No escape from reality Open your eyes, look up to the skies and see I'm just a poor boy, (oooh, poor boy) I need no sympathy Because I'm easy come, easy go Little high, little low Anyway the wind blows, doesn't really matter to me To me Mama, just killed a man Put a gun against his head Pulled my trigger now he's dead Mama, life had just begun But now I've gone and thrown it all away Mama, oooh, ooh, ooh, ooh Didn't mean to make you cry If I'm not back again this time tomorrow Carry on, carry on, as if nothing really matters Too late, my time has come Sends shivers down my spine Body's aching all the time Goodbye everybody, I've got to go Gotta leave you all behind and face the truth Mama, oooh, ooh, ooh, ooh (Anyway the wind blows) I don't wanna die I sometimes wish I'd never been born at all I see a little silhouetto of a man Scaramouche, Scaramouche will you do the fandango? Thunderbolts and lightning Very, very frightening me Galileo, galileo Galileo, galileo Galileo, figaro Magnifico-o-o-o-oh I'm just a poor boy, nobody loves me He's just a poor boy from a poor family Spare him his life from this monstrosity Easy come, easy go, will you let me go Bismillah! No, we will not let you go, let him go Bismillah! We will not let you go, let him go Bismillah! We will not let you go, let me go Will not let you go, let me go Never, never, never, never let me go-o-o-o-oh (Never let you go) No, no, no, no, no, no, no Oh, mama mia, mama mia Mama mia let me go Beelzebub has a devil put aside for me, for me, for me So you think you can stone me and spit in my eye? So you think you can love me and leave me to die? Oh, baby, can't do this to me baby Just gotta get out, just gotta get right outta here Ooooh, ooooh, ooooh Oooh yeah, oooh yeah Nothing really matters Anyone can see Nothing really matters Nothing really matters to me Anyway the wind blows Producers : Roy Thomas Baker / Queen Lead & Backing Vocals : Freddie Mercury Piano : Freddie Mercury Electric Guitar : Brian May Bass Guitar : John Deacon Drums, Timpani & Gong : Roger Taylor Operatic Vocals : Freddie Mercury (Middle Register) / Brian May (Low Register) / Roger Taylor (High Register) Recorded at Rockfield Studio, Roundhouse, Sarm East Studios, Scorpio Sound, and Wessex Sound Studios   <a name="maodian2"><h3>Call Me Maybe</h3></a> I threw a wish in the well, Don't ask me, I'll never tell I looked to you as it fell, and now you're in my way I trade my soul for a wish, pennies and dimes for a kiss I wasn't looking for this, but now you're in my way Your stare was holdin', Ripped jeans, skin was showin' Hot not, wind was blowin' Where you think you're going, baby? Hey, I just met you, and this is crazy, but here's my number, so call me, maybe? It's hard to look right, at you baaaabeh, but here's my number, so call me, maybe? Hey, I just met you, and this is crazy, but here's my number, so call me, maybe? And all the other boys, try to chaaase me, but here's my number, so call me, maybe? You took your time with the call, I took no time with the fall You gave me nothing at all, but still, you're in my way I beg, and borrow and steal Have foresight and it's real I didn't know I would feel it, but it's in my way Your stare was holdin', Ripped jeans, skin was showin' Hot not, wind was blowin' Where you think you're going, baby? Hey, I just met you, and this is crazy, but here's my number, so call me, maybe? It's hard to look right, at you baaaabeh, but here's my number, so call me, maybe? Hey, I just met you, and this is crazy, but here's my number, so call me, maybe? And all the other boys, try to chaaase me, but here's my number, so call me, maybe? Before you came into my life I missed you so bad I missed you so bad I missed you so, so bad Before you came into my life I missed you so bad And you should know that I missed you so, so bad It's hard to look right, at you baaaabeh, but here's my number, so call me, maybe? Hey, I just met you, and this is crazy, but here's my number, so call me, maybe? And all the other boys, try to chaaase me, but here's my number, so call me, maybe? Before you came into my life I missed you so bad I missed you so bad I missed you so so bad Before you came into my life I missed you so bad And you should know that So call me, maybe?     </center> </body> </html>

相對路徑

./ 當前html檔案所在目錄

../ 回到html檔案所在目錄的上一層目錄

muluming/ 進入到html檔案所在目錄的同級目錄muluming

../muluming/ 進入到html檔案所在目錄的上一層的目錄下的muluming

絕對路徑

C:\Users\yupeng\Desktop

影象

例：
```

圖片

Ladygaga

世界上第二帥的頭像

####視訊： <video src="路徑" autoplay controls loop ></video>

<!doctype html>

視訊

本地視訊

您的瀏覽器不支援

線上視訊

您的瀏覽器不支援

```

HTML一小時入門，半天掌握

HTML一小時入門，半天掌握

還沒有寫完，後續持續更新

首先來熟悉一下html的基本結構

標題。

~

文字格式

有序列表

無序列表

超連結

錨點

相對路徑

絕對路徑

影象

Ladygaga

世界上第二帥的頭像

本地視訊

線上視訊

HTML一小時入門，半天掌握

HTML一小時入門，半天掌握

還沒有寫完，後續持續更新

首先來熟悉一下html的基本結構

標題。

~

文字格式

有序列表

無序列表

超連結

錨點

相對路徑

絕對路徑

影象

Ladygaga

世界上第二帥的頭像

本地視訊

線上視訊

最新文章