HTML基礎 之 初識HTML

什么是 HTML?

  • HTML 是用來描述網頁的一種語言。
  • HTML 指的是超文本標記語言 (Hyper Text Markup Language)
  • HTML 不是一種編程語言,而是一種標記語言 (markup language)
  • 標記語言是一套標記標簽 (markup tag)
  • HTML 使用標記標簽來描述網頁

HTML 標簽

  • HTML 標記標簽通常被稱為 HTML 標簽 (HTML tag)。
  • HTML 標簽是由尖括號包圍的關鍵詞,比如 <html>
  • HTML 標簽通常是成對出現的,比如 <b> 和 </b>
  • 標簽對中的第一個標簽是開始標簽,第二個標簽是結束標簽
  • 開始和結束標簽也被稱為開放標簽和閉合標簽

HTML 文檔 = 網頁

  • HTML 文檔描述網頁
  • HTML 文檔包含 HTML 標簽和純文本
  • HTML 文檔也被稱為網頁

Web 瀏覽器的作用是讀取 HTML 文檔,并以網頁的形式顯示出它們。瀏覽器不會顯示 HTML 標簽,而是使用標簽來解釋頁面的內容:

<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

例子解釋

<html> 與 </html> 之間的文本描述網頁
<body> 與 </body> 之間的文本是可見的頁面內容
<h1>   與 </h1> 之間的文本被顯示為標題
<p>    與 </p> 之間的文本被顯示為段落

HTML 標題

HTML 標題(Heading)是通過 <h1> - <h6> 等標簽進行定義的。

<h1>一級標題</h1>
<h2>二級標題</h2>
<h3>三級標題</h3>
有此類推

HTML 段落

HTML 段落是通過 <p> 標簽進行定義的。

<p> 一段話的類容</p>

HTML 鏈接

HTML 鏈接是通過 <a> 標簽進行定義的。

<a>一個網絡連接</a>

注釋:在 href 屬性中指定鏈接的地址。

HTML 圖像

HTML 圖像是通過 <img> 標簽進行定義的。

![](w3school.jpg)

src 為 圖片地址
注釋:圖像的名稱和尺寸是以屬性的形式提供的。


HTML 元素

HTML 元素指的是從開始標簽(start tag)到結束標簽(end tag)的所有代碼。

開始標簽 元素內容 結束標簽
<p> This is a paragraph </p>
<a href="default.htm" > This is a link </a>
<br />

注釋:開始標簽常被稱為開放標簽(opening tag),結束標簽常稱為閉合標簽(closing tag)。

HTML 元素語法

  • HTML 元素以開始標簽起始
  • HTML 元素以結束標簽終止
  • 元素的內容是開始標簽與結束標簽之間的內容
  • 某些 HTML 元素具有空內容(empty content)
  • 空元素在開始標簽中進行關閉(以開始標簽的結束而結束)
  • 大多數 HTML 元素可擁有屬性

嵌套的 HTML 元素

  • 大多數 HTML 元素可以嵌套(可以包含其他 HTML 元素)。
  • HTML 文檔由嵌套的 HTML 元素構成。

HTML 文檔實例

<html>

<body>
<p>This is my first paragraph.</p>
</body>

</html>

上面的例子包含三個 HTML 元素。

HTML 實例解釋

<p> 元素:

<p>This is my first paragraph.</p>

這個 <p> 元素定義了 HTML 文檔中的一個段落。

這個元素擁有一個開始標簽 <p>,以及一個結束標簽 </p>。

元素內容是:This is my first paragraph。

<body> 元素:

<body>
<p>This is my first paragraph.</p>
</body>

<body> 元素定義了 HTML 文檔的主體。

這個元素擁有一個開始標簽 <body>,以及一個結束標簽 </body>。

元素內容是另一個 HTML 元素(p 元素)。

<html> 元素:

<html>

<body>
<p>This is my first paragraph.</p>
</body>

</html>

<html> 元素定義了整個 HTML 文檔。

這個元素擁有一個開始標簽 <html>,以及一個結束標簽 </html>。

元素內容是另一個 HTML 元素(body 元素)。

不要忘記結束標簽

即使您忘記了使用結束標簽,大多數瀏覽器也會正確地顯示 HTML:

<p>This is a paragraph
<p>This is a paragraph

上面的例子在大多數瀏覽器中都沒問題,但不要依賴這種做法。忘記使用結束標簽會產生不可預料的結果或錯誤。

注釋:未來的 HTML 版本不允許省略結束標簽。

空的 HTML 元素

沒有內容的 HTML 元素被稱為空元素。空元素是在開始標簽中關閉的。

<br> 就是沒有關閉標簽的空元素(<br> 標簽定義換行)。
在 XHTML、XML 以及未來版本的 HTML 中,所有元素都必須被關閉。
在開始標簽中添加斜杠,比如 <br />,是關閉空元素的正確方法,HTML、XHTML 和 XML 都接受這種方式。
即使 <br> 在所有瀏覽器中都是有效的,但使用 <br /> 其實是更長遠的保障。

HTML 標簽對大小寫不敏感

HTML 屬性

  • 屬性為 HTML 元素提供附加信息。
  • HTML 標簽可以擁有屬性。
  • 屬性提供了有關 HTML 元素的更多的信息。
  • 屬性總是以名稱/值對的形式出現,比如:name="value"。
  • 屬性總是在 HTML 元素的開始標簽中規(guī)定。
HTML 鏈接由 <a> 標簽定義。鏈接的地址在 href 屬性中指定:
<a >This is a link</a>

HTML 參考手冊
HTML 全局屬性

基礎學習的記錄,希望對你們有幫助?。?!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容