爬虫必备html和css基础知识

一、引言

在当今数字化时代，网络上蕴含着海量的有价值数据。Python 爬虫技术凭借其高效、灵活的特点，成为了获取这些数据的重要手段。而网页数据通常以 HTML 格式呈现，要想准确地从网页中提取所需信息，就需要深入了解 HTML 标签的结构和含义，以及如何运用 CSS 选择器精准定位目标元素。本文将围绕这两方面展开详细阐述，旨在帮助掌握 Python 爬虫的关键基础技能。

二、常用 HTML 标签详解

2.1 文本结构标签

2.1.1 标签

• 定义：标签是 HTML 文档的根标签，所有其他 HTML 元素都必须包含在其中，它标志着一个 HTML 文档的开始和结束。
• 用途：作为整个 HTML 文档的容器，为其他元素提供了基本的框架结构。
• 属性：常见属性为lang，用于指定文档的语言，如lang="en"表示英文文档，有助于搜索引擎和辅助设备理解文档内容。
• 默认样式：无特定默认样式，它主要是为文档提供逻辑结构。
• 示例代码：

html

2.1.2 标签

• 定义：标签用于包含文档的元数据，这些数据不直接显示在网页上，但对文档的描述、配置等方面起着重要作用。
• 用途：包含如文档标题、字符编码、引用的外部样式表和脚本等信息，为浏览器和搜索引擎提供必要的指引。
• 属性：无特定常用属性，但可包含多个元数据标签，如。
• 默认样式：无默认样式，其内容不参与页面的视觉呈现。
• 示例代码：

html

2.1.3 标签

• 定义：标签包含了网页的可见内容，是用户在浏览器中实际看到的部分。
• 用途：展示文本、图像、链接等各种网页元素，是网页内容的主要载体。
• 属性：早期有bgcolor（设置背景颜色）、text（设置文本颜色）等属性，但现在推荐使用 CSS 来设置样式。
• 默认样式：默认背景颜色和文本颜色取决于浏览器设置，通常背景为白色，文本为黑色。
• 示例代码：

html

    
    


    
欢迎来到我的网页
    
这是一段示例文本。

2.1.4

-

标签

• 定义：

  -

  标签用于定义网页中的标题，

  为最高级标题，

  为最低级标题。

• 用途：组织网页内容的结构，突出重要信息，帮助用户快速了解页面的主旨和层次。
• 属性：无特定常用属性。
• 默认样式：不同级别标题有不同的字体大小和加粗效果，

  字体最大且最粗，

  字体最小。

• 示例代码：

html

    
    


    
一级标题
    
二级标题
    
三级标题
    
四级标题
    
五级标题
    
六级标题

2.1.5

标签

• 定义：

  标签用于定义段落，将相关的文本组织在一起。

• 用途：使文本内容具有清晰的段落结构，便于阅读和理解。
• 属性：无特定常用属性。
• 默认样式：段落之间有一定的间距，默认字体和颜色与页面整体设置一致。
• 示例代码：

html

    
    


    
这是第一个段落。
    
这是第二个段落。

2.2 链接与图像标签

2.2.1 标签

• 定义：标签用于创建超链接，允许用户在不同网页或同一网页的不同位置之间进行跳转。
• 用途：实现网页之间的导航和信息关联，是互联网信息交互的重要手段。
• 属性：最重要的属性是href，用于指定链接的目标地址；target属性可指定链接的打开方式，如target="_blank"表示在新窗口中打开链接。
• 默认样式：链接文本通常带有下划线，未访问的链接颜色一般为蓝色，访问过的链接颜色可能会改变。
• 示例代码：

html

    
    


    访问示例网站

2.2.2 标签

• 定义：标签用于在网页中插入图像，为网页增添视觉内容。
• 用途：展示图片、图标等视觉元素，增强网页的吸引力和信息传达能力。
• 属性：src属性指定图像的源文件路径；alt属性提供图像的替代文本，当图像无法显示时显示该文本；width和height属性可设置图像的宽度和高度。
• 默认样式：图像按原始大小显示，无边框等额外样式。