1. 程式人生 > 其它 >Python爬蟲入門2:HTML知識簡介

Python爬蟲入門2:HTML知識簡介

技術標籤:Python爬蟲入門pythonhtmlcss爬蟲程式語言

☞ ░ 前往老猿Python部落格 https://blog.csdn.net/LaoYuanPython

一、HTML語言簡介

HTML 指的是超文字標記語言 (Hyper Text Markup Language),它不是一種程式語言,而是一種使用一套標記標籤(markup tag)來標記元素作用的標記語言,標記語言使用標記標籤來描述網頁的內容。標記標籤不會出現在頁面中,只有標籤中的內容才會顯示在頁面上。

二、HTML標籤和HTML元素

HTML 標記標籤通常被稱為 HTML 標籤 (HTML tag),是由一對尖括號括起來的關鍵詞,稱為標籤名,如 <html>、<a>、<h1>

。標籤不區分大小寫,但是推薦使用小寫,(X)HTML 版本中強制使用小寫,這樣更加嚴謹。

標籤的標記分為起始標籤和結束標籤。HTML 元素指的是從開始標籤(start tag)到結束標籤(end tag)的所有內容。

起始標籤用於標記對應HTML元素的開始位置,結束標籤用於標記HTML元素的結束位置。

標籤分為單標籤和雙標籤,都需要起始標籤和結束標籤,不同的是單標籤起始、結束標籤都寫在一個尖括號裡而雙標籤則分別寫在兩個尖括號裡。單標籤又稱為空標籤,雙標籤又稱為閉合標籤。單標籤的結束標籤就是在標籤的右尖括號前面一個反斜槓,如<br />就是一個單標籤,雙標籤的結束標籤就是在左尖括號後比開始標籤多了一個反斜槓,如<html>

</html>就是一對開始標籤和結束標籤。

三、HTML元素的分類

不同的HTML標籤對應的HTML元素可以根據位置特徵等分為兩類:

  1. 塊元素(block)
    塊元素主要用來搭建網站架構、頁面佈局、承載內容,常見塊元素對應的標籤有: address、blockquote、center、dd、dl、dt、div、dir、fieldset、form、h1-h6、hr、isindex、li、menu、noframes、noscript、ol、table、p、pre、table、u、ul,即這些標籤對應的HTML元素為塊元素。塊元素可設定寬高以及內外邊距、在新行上開始,塊級元素如果不設定寬度和高度,則寬度預設為父級元素(容器)的寬度。高度則根據內容大小自動填充。
  2. 行元素(inline)
    行元素用於加強內容顯示、控制細節,例如:加粗、斜體等等,常見行元素對應的標籤有: a、abbr、acronym、b、bdo、big、br、cite、code、dfn、em、font、i、img、input、kbd、label、q、s、samp、select、small、span、strike、strong、sub、sup、textarea、tt、u、var …等,行元素和其他元素都在一行上,高、行高及頂和底邊距不可改變,寬度就是它的文字或圖片的寬度,不可改變,可以設定左右內、外邊距,行元素與其他行元素可共處一行

四、標籤巢狀

雙標籤的開始標籤和結束標籤之間可以巢狀其他標籤,不過需要遵循以下規則:

  1. 兩個標籤巢狀時必須確保開始標籤和結束標籤的層級是一致的,即開始標籤在外層的結束標籤必須在外層;
  2. 建議書寫HTML文字時巢狀標籤的內層標籤相對外層標籤進行縮排以體現巢狀關係;
  3. 塊元素標籤可以包含行元素標籤,但行元素標籤不能包含塊元素標籤,它們只能包含其它的行元素標籤;
  4. a標籤想要用hover必須把它的路徑寫全;
  5. 偽類(hover/link/visited/active)只能加給a標籤,在支援 CSS 的瀏覽器中,偽類表示連結的不同狀態,這些狀態包括:活動狀態,已被訪問狀態,未被訪問狀態,和滑鼠懸停狀態:
  • link用在為訪問的連線上;
  • visited用在已經訪問過的連線上;
  • hover用於滑鼠游標置於其上的連線;
  • active用於獲得焦點(比如,被點選)的連線上。
  1. 塊元素標籤之間:
    1)h1、h2、h3、h4、h5、h6、p、dt標籤內不能再巢狀塊標籤;
    2)li元素可以嵌入ul, ol, div;
    3)div內可以再巢狀其他塊元素;
    4)塊元素巢狀其他標籤時,同一層級必須都是塊元素,或必須都是行元素,不能一部分是塊元素,一部分是行元素。如<div><span></span><p></p></div>這種模式是錯誤的,因為span是行元素,p是塊元素,所以這個是錯誤的巢狀。

雖然標籤可以巢狀,但為了提高瀏覽器的渲染效率,應該儘量少使用標籤巢狀。

五、標籤的屬性

HTML 標籤可以擁有屬性,屬性為HTML元素提供的更多的附加資訊, 屬性只能在開始標籤中使用,總是以名稱/值對的形式出現,屬性與屬性之間需要用空格隔開,屬性使用小寫。常用的屬性有class(樣式類)、id(屬性名)、style(顯示風格)、title(標題)、align(對齊方式)、bgcolor(背景色)、color(顏色)。
如:<p class="textline" name="line1">。而<a>標籤定義HTML 連結,連結的地址在<a>標籤href 屬性中指定,如:

<a href="https://blog.csdn.net/ LaoYuanPython " > 老猿Python</a>

六、常用標籤及含義

  1. <html> 與 </html>:用於標記在這對標籤之間的內容為HTML語言文字;
  2. <body> 與 </body>:用於標記這對標籤之間的文字是可見的頁面內容;
  3. <hn> 與 </hn> :n為1-6,用於標記這對標籤之間的文字顯示為標題;
  4. <p>與 </p>: 用於標記這對標籤之間的文字被顯示為一個獨立段落;
  5. <a>與 </a>:用於標記這對標籤之間的文字為一個網址連結;
  6. <img>:用於標記影象,這是一個單標籤,如:<img src="LaoYuanPython.jpg" />
  7. <br />:單標籤,用於標記換行;
  8. <hr /> :單標籤,用於顯示一根水平線;
  9. <!--註釋內容-->:用於存放註釋;
  10. <center>: 定義居中的內容;
  11. <font> :定義字型;
  12. <u>:定義下劃線文字;
  13. <i>:定義斜體文字;
  14. <b>: 定義粗體文字;
  15. <big>: 定義大號字;
  16. <em>: 定義著重文字;
  17. <small>: 定義小號字;
  18. <strong>: 定義加重語氣;
  19. <sub>: 定義下標字;
  20. <sup>: 定義上標字;
  21. <ins>: 定義插入字;
  22. <del>: 定義刪除字;
  23. <link>:標籤定義文件與外部資源的關係,此元素只能存在於 head 部分,不過它可出現任何次數。

本節簡單介紹了HTML語言的基礎知識,如果大家有不理解的地方,可以再在網上多查查資料。這些知識對於爬蟲程式解析網頁內容非常重要,如果不理解基本概念,對網頁解析的知識就不太好理解。另外本節介紹的內容並不全面,也不是最新的,例如關於標籤分類,行元素標籤現在又進一步細分了,關於格式控制的標籤現在建議使用css樣式,這些東西老猿就不再詳細介紹了,大家感興趣可以到w3school 更多學習一下。

寫博不易,敬請支援:

如果閱讀本文於您有所獲,敬請點贊、評論、收藏,謝謝大家的支援!

更多Python爬蟲入門的介紹請參考專欄《Python爬蟲入門 》
專欄網址https://blog.csdn.net/laoyuanpython/category_10762553.html

關於老猿的付費專欄

  1. 付費專欄《https://blog.csdn.net/laoyuanpython/category_9607725.html 使用PyQt開發圖形介面Python應用》專門介紹基於Python的PyQt圖形介面開發基礎教程,對應文章目錄為《 https://blog.csdn.net/LaoYuanPython/article/details/107580932 使用PyQt開發圖形介面Python應用專欄目錄》;
  2. 付費專欄《https://blog.csdn.net/laoyuanpython/category_10232926.html moviepy音視訊開發專欄 )詳細介紹moviepy音視訊剪輯合成處理的類相關方法及使用相關方法進行相關剪輯合成場景的處理,對應文章目錄為《https://blog.csdn.net/LaoYuanPython/article/details/107574583 moviepy音視訊開發專欄文章目錄》;
  3. 付費專欄《https://blog.csdn.net/laoyuanpython/category_10581071.html OpenCV-Python初學者疑難問題集》為《https://blog.csdn.net/laoyuanpython/category_9979286.html OpenCV-Python圖形影象處理 》的伴生專欄,是筆者對OpenCV-Python圖形影象處理學習中遇到的一些問題個人感悟的整合,相關資料基本上都是老猿反覆研究的成果,有助於OpenCV-Python初學者比較深入地理解OpenCV,對應文章目錄為《https://blog.csdn.net/LaoYuanPython/article/details/109713407 OpenCV-Python初學者疑難問題集專欄目錄
  4. 付費專欄《https://blog.csdn.net/laoyuanpython/category_10762553.html Python爬蟲入門 》站在一個網際網路前端開發小白的角度介紹爬蟲開發應知應會內容,包括爬蟲入門的基礎知識,以及爬取CSDN文章資訊、博主資訊、給文章點贊、評論等實戰內容。

前兩個專欄都適合有一定Python基礎但無相關知識的小白讀者學習,第三個專欄請大家結合《https://blog.csdn.net/laoyuanpython/category_9979286.html OpenCV-Python圖形影象處理 》的學習使用。

對於缺乏Python基礎的同仁,可以通過老猿的免費專欄《https://blog.csdn.net/laoyuanpython/category_9831699.html 專欄:Python基礎教程目錄)從零開始學習Python。

如果有興趣也願意支援老猿的讀者,歡迎購買付費專欄。

跟老猿學Python!

☞ ░ 前往老猿Python博文目錄 https://blog.csdn.net/LaoYuanPython