HTML語法規範

【HTML指南】Day03 – HTML 語法規範,必看助你少走彎路

正式進入 HTML 我們要先了解 HTML 的語法規範,如果規則是什麼要如何開始? 對吧就像買個模型你不看說明書就開始組裝,你最後雖然也可以組裝出來,但是你卻會忽略很多細節,如果你有看說明書上面標記、標註要注意事項式是不是可以省下寶貴時間有系統性的一整個組出來。

當然不是每個人都願意聽忠告的,那你就跳離本頁吧!本篇是寫給願意花幾分鐘省下繞彎路時間的人。

  • HTML 寫在哪裡?
  • HTML 規範是什麼?
  • HTML 標籤都是一對嗎?
點我瞭解 小青如何每月多賺5位數台幣

HTML 寫在哪裡?

當你開始要寫第一個 HTML,不管你用的電腦作業系統是什麼,都可以直接新建一個文件記事本就可以開始在裏頭寫 HTML 語法了。

以上初學就是先在桌面新建一個資料夾,在資料夾裡新增文件記事本

HTML 規範該寫什麼?

在記事本寫 HTML 你要想,如果這樣寫原本記事本式寫文字,但你今天要寫 HTML 了,HTML 就是超文本標記語言,原本的記事本已經不是在是記事本變成了超文本這點要記住,如果還是不知道或忘記超文本是什麼可以複習之前我寫的有關超文本是什麼的一篇文章,複習完了再回來這裡繼續學習,我們在這裡等你。

HTML 雙標籤是什麼?

要開始寫 HTML,一定是先寫左尖括號加上英文 html 再加上右尖括號,這樣寫完就是一個標籤了,如下表示。

<html>

那基本上 HTML 標籤都是成對出現的,這很重要要記住!!! 這很重要要記住!!! 這很重要要記住!!!

另一個 html 標籤左尖括號加上符號左斜線和英文 html 再加上右尖括號,如下圖表示

</html>

一對的話就是以下這樣子表示,如果不好記就想成有斜線符號的是爸爸因為很像有帶靶,那沒有斜線的標籤就是媽媽,這樣子比較好去記,又有人稱為雙標籤,而 html 標籤是一定要寫,所有標籤都要在 html 標籤裡面才能賦予他們功能,如果獨立在外是沒辦法使用。

<html> </html>
點我瞭解 小青如何每月多賺5位數台幣

HTML 單標籤是什麼?

在前面我們了解了雙標籤,但也是有些人喜歡一個人過日子所以他不跟別成成雙成對,但是我們在開發網頁或是網站會用到機率很少,那是因為在做前端是把整個網站頁面骨架規劃出來,還有決定布局空間規畫就好,真正用到單標籤例如空格標籤 <br /> 用在文字換行居多。

<br />

例如換行標籤 <br /> 就是用在文字方面居多,單別忘了前端人員的本質是規劃網站的骨架和空間布局而不是在寫網站文章!!

前端人員規劃好骨架和空間佈局,會交給後端人員是寫後台管理系統,他們會寫好文章編輯器也就是,真正交給客戶的面向根本不懂 HTMLCSS 或是JavaScript,他們只要會用文章編輯器就好也就是單標籤都會被文章編輯器取代掉!

HTML 基本語法注意

  • 所有的關鍵字都必須在尖括號裡頭,例如 <html>
  • HTML 標籤通常是成對出現的,例如 <html></html>,又稱為雙標籤,有開始標籤就有結束標籤
  • 有特殊的標籤必須是單標籤 ( 使用極少 ),例如 <br />,稱為單標籤

HTML 標籤的關係

在這裡是來探討雙標籤,它又可以分成兩大類在往後非常的重要需要注意

  • 包含關係
  • 並列關係

包含關係

從字面上來看就很好理解,一個標籤裡面又包含另一對標籤,這樣就是叫做包含關係。

如果不好理解可以想成漢堡不是有上面一塊麵包和下面一塊麵包,他們就是一對的關係,你應該沒看過漢堡有沒麵包的吧!這樣上麵包和下麵包裡面所包含的蛋、肉、菜。

我們整理一下,也就是說上麵包和下麵包,包含蛋、肉、菜他們的關係就是包含關係。

那一對html標籤裡頭有一對title標籤也是包含關係又稱為父子關係,如下圖表示。

<html>

    <title> </title>

</html>

小總結:

在這裡我們的主軸視角是html標籤和漢堡的麵包,所以叫做包含關係,那你有想過換另一個視角去看外面的東西嗎?它是不是也有一個名稱?是的它也是也有一個專有名詞,title標籤和蛋、肉、菜也就是嵌套關係

並列關係

並列關係和包含關係從字面上來也好理解,就是大家並在一起,這樣就是叫做並列關係

如果不好理解,想成一個漢堡和另一個漢堡他們是並在一起,裡面的蛋、肉、菜不是互相碰在一起,所以我們看這裡個漢堡的關係就是並列關係。

那如果一對 head 標籤和一對 body 標籤他們是並在一起是不是就很好理解他們是並列關係,如下圖表示。

<head> </head>
<body> </body>

小總結:

只要一對標籤和另一對標籤都是互相獨立,它做它的事我做我的事彼此互不相關,這樣就是並列關係,有些人又會稱為兄弟關係,總結來說就算兄弟倆個性還是會有所不同的。

總結

在本篇我們了解 HTML 語法規範一開始在寫 html 時所有標籤都必須包含在 html 標籤裡頭。

html 標籤最常用的都是一對的又稱為雙標籤,有雙標籤就會有單標籤但是單標籤我們用的很少,不太需要記下來。

雙標籤又分成包含關係 ( 父子關係 ) 和並列關係 ( 兄弟關係 ),也就是說包含關係裡面也是可以有很多並列關係的,從裡面的東西去看外面的東西就做遷套關係這點需要注意專有名詞。

<html>

    <title> </title>
    <head> </head>

</html>

點我瞭解 小青如何每月多賺5位數台幣

其他相關文章推薦:

能看到這裡通常只有 1% 的人,很感謝您可以閱讀到這裡(鞠躬)
本篇文章歡迎社群分享,可按分享按鈕,讓更多的人知道此篇文章
如果是引用本篇文章任何段落請附上本篇文章連結即可唷!
嚴禁搬運整篇文章到你個人部落格、寫成新聞稿
這麼做你會被任何搜尋引擎懲罰 Ban 掉
如需合作請右上角服務項目 -> 聯繫我們
by 小青

發表迴響