iT邦幫忙

2022 iThome 鐵人賽

DAY 2
0
自我挑戰組

小白網頁設計練成記系列 第 2

小白網頁設計練成記-DAY2-HTML介绍

  • 分享至 

  • xImage
  •  

HTML 又名超文本標記語言(Hyper Text Markup Languge)不是一種編程語言,而是一種創建網路的標記語言,因電腦沒有眼睛沒有鼻子,所以在創建網路的時候必須使用HTML來翻譯內容,而HTML里是一套標記標籤,我們使用一連串的標記標籤(markup tag)來描述網頁。下面是我們常看到的HTML模板:

<!DOCTYPE html>  #聲明為HTML5文檔
<html>           #是HTML頁面的根元素
<head>           #包含文檔中的meta,如<meat charset="utf-8">意思是定義網頁編碼格式為utf-8
<meta charset="utf-8">
    <title>hello world</title>  #描述文檔標題
</head>
<body>  #可見的頁面內容

<h1>标题</h1>  #大標題
<p>段落</p>    #段落

</body>
</html>

標記語言都會用<>及< />來表示開始和結束,如< p >段落開始 </ p >段落結束,
而標籤和元素通常是在描述同個東西,但嚴格來說元素包含了開始標籤和結束標籤。

舉例:

<p>我是段落</p>

HTML中不支持任何空格、回車、制表符,它们都会被解析成一个空白字符。

舉例:

he********llo

world

上面包含8個空格,2個回車
最後判讀為 = he llo world

網頁結構

我們編輯的HTML元素並不會直接顯示在瀏覽器的頁面上,而是用來決定如何展現HTML頁面的內容給Client端,所以啦,這時候我們需要知道HTML網頁的結構中,那些東西會直接呈現在網頁上,看一下下面的示範:

<!DOCTYPE html>                 #不可見
<html>                          #不可見
<head>                          #不可見
<meta charset="utf-8">          #不可見
    <title>hello world</title>  #不可見
</head>
<body>                          #可見的頁面內容

<h1>标题</h1>                   #可見的頁面內容
<p>段落</p>                     #可見的頁面內容

</body>                         #可見的頁面內容
</html>                         #不可見

由上述可知道只有< body >區域內的內容才會在頁面上顯示

通用聲明

從1991年迄今,HTML的版本已經更新迭代到HTML5,每個版本都有不同的通用聲明。

通用聲明又是甚麼?通用聲明有助於瀏覽器中正確顯示網頁,

HTML 5 的通用聲明就是:<!DOCTYPE html>

我是結語

以上就是Eric對HTML的介紹啦,今天是鐵人賽第2天,寫這些主要是給自己的學習留下足跡,每天堅持輸入+輸出,
希望也可以幫助到像我一樣的小白~


上一篇
小白網頁設計練成記-DAY1-前言
下一篇
小白網頁設計練成記-DAY3-淺談HTML 元素
系列文
小白網頁設計練成記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言