HTML 基礎入門

Quinty發表於2019-02-16

最近學習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

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

相關文章