## HTML 和 CSS: 网页的骨骼与皮肤### 简介在互联网世界中，我们每天浏览着无数的网页，从简单的博客到复杂的电商平台，它们都离不开两种基础技术：HTML 和 CSS。简单来说，HTML 构建了网页的内容和结构，就像房子的框架；而 CSS 则负责网页的外观和样式，如同房子的装饰和布局。### 一、 HTML: 超文本标记语言#### 1.1 什么是 HTML？HTML（HyperText Markup Language）中文译为超文本标记语言，它使用标签来描述网页内容的语义和结构。我们可以将网页想象成一篇文章，而 HTML 标签就像文章中的标题、段落、图片等元素，它们告诉浏览器如何解析和显示网页内容。#### 1.2 HTML 标签的语法HTML 标签通常由尖括号包裹的关键词组成，例如 `

` 表示段落，`` 表示图片。大多数标签都是成对出现的，例如 `

这是一个段落。

`，其中 `

` 是结束标签，表示段落的结束。#### 1.3 常用的 HTML 标签

``、``、``

: 这些标签定义了 HTML 文档的基本结构。

`

` 到 `

`

: 定义不同级别的标题。

`

`

: 定义段落。

``

: 创建超链接。

``

: 插入图片。

`

`、`
`、`
1. `

   : 创建无序列表、有序列表和列表项。

   `

   `、``

   : 用于网页布局和样式化的通用容器。### 二、 CSS: 层叠样式表#### 2.1 什么是 CSS？CSS（Cascading Style Sheets）中文译为层叠样式表，它用于控制网页的样式和布局。通过 CSS，我们可以改变网页的字体、颜色、大小、间距、以及元素的定位等，从而打造出美观且易于阅读的网页。#### 2.2 CSS 语法CSS 代码由选择器和声明块组成。选择器用于选择要应用样式的 HTML 元素，声明块包含了一组样式规则，每条规则由属性和值组成，例如：```css p {color: blue;font-size: 16px; } ```这段代码表示将所有 `

   ` 元素的文字颜色设置为蓝色，字体大小设置为 16 像素。#### 2.3 CSS 的引入方式

   内联样式

   : 直接在 HTML 标签中使用 `style` 属性添加样式，例如 `

   `。

   内部样式

   : 在 HTML 文档的 `` 标签中使用 `