HTML 基礎入門

Quinty發表於2019-02-16
HTML

最近學習HTML5的知識，屬於入門級別。粗略接觸感覺並不是十分枯燥困難，不過據說HTML都是入門容易深入很難，但願以後不會被難倒吧。

首先介紹一下HTML

HTML是HyperText Markup Language(超文字標記語言)的簡寫，他不是一種程式語言，而是一種標記語言，用於告訴瀏覽器如何構造你的頁面。他可以由一系列HTML元素組合成web開發人員想要的簡單或者複雜的頁面。“超文字”就是指頁面內可以包含圖片、連結，甚至音樂、程式等非文字元素。HTML也是一種規範，一種標準，它通過標記符號來標記要顯示的網頁中的各個部分。網頁檔案本身是一種文字檔案，通過在文字檔案中新增標記符，可以告訴瀏覽器如何顯示其中的內容（如：文字如何處理，畫面如何安排，圖片如何顯示等）。瀏覽器按順序閱讀網頁檔案，然後根據標記符解釋和顯示其標記的內容，對書寫出錯的標記將不指出其錯誤，且不停止其解釋執行過程，編制者只能通過顯示效果來分析出錯原因和出錯部位。可以使用.html與.htm作為html檔案的字尾名（副檔名）

HTML5 前段有三個要素

  • HTML
  • CSS
  • JS

    先講其中HTML的元素
    HTML的元素中包含單標籤元素和雙標籤元素，也分為塊級元素、行內元素和其它元素。具體在下面的內容中闡述。

一個完整的Html網頁是由多個Html元素按照一定的方式組成的。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello</title>
</head>
<body>
  <p>Hello World</p>    
</body>
</html>

  1. DOCTYPE
    在Html非常年輕的時候（1991、2年左右），doctype是用來作為一組規則的連結，HTML頁面必須遵循這些規則才能被認為是好的HTML，這些規則會用來檢測網頁是不是存在問題。然而，這些年沒有人真正的關心doctype，他們只是一個歷史產物必須包含在頁面中。以下是我們需要簡單瞭解的，記住H5的文件型別即可。
    1.1嚴格的文件型別

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    1.2寬鬆的文件型別

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    1.3H5文件型別

    <!DOCTYPE html>

2.<html>
Html的根元素，用來包含html文件的所有元素
3.<head>
包含在頭部的內容不會被顯示的頁面中，這裡通常包含頁面的編碼，作者，頁面的描述資訊，js的匯入，css的匯入等資訊。
4.<meta charset=”utf-8″>
用來宣告當前文件的編碼方式為utf-8
5.<title>
用來宣告當前文件的標題，標題將會出現在瀏覽器的選項卡中
6.<body>
所有想要顯示在瀏覽器中的元素都被包含在該元素中。
7.<p>
html內容中的標籤元素

講完以上的組成，接下來就講一講剛剛擱置的HTML元素，即上述的第七個內容

上述的P標籤就屬於雙標籤，即由<p></p>組成，也是塊級元素，即獨佔一行空間，用來佈局段落，列表，導航選單，腳註等結構，不要將塊級元素巢狀在行內元素中。
除了p標籤以外，塊級元素還有div、h1-h6、uloldl等

再來說說行內元素，行內元素與其他元素共享一行空間，一般被巢狀在塊級元素中，通常作為段落的一部分出現。
常見的有spanaimg等

除了這些之外還有表格
表格的元素主要有caption、thead、tbody、tfoot

今天暫時就先分享這些，內容粗淺，見笑啦。

相關文章