## 第二章：样式与布局

### 2.1 CSS基础

CSS（层叠样式表）是用于控制网页外观的技术，它与HTML配合使用，可以改变文字颜色、背景色、字体大小等属性，从而美化页面。

#### 2.1.1 内联样式

内联样式直接写在HTML元素的style属性中：

```html

这是一个红色的段落。

```

#### 2.1.2 内部样式表

这是蓝色的段落。

```

#### 2.1.3 外部样式表

```html

```

### 2.2 布局技术

#### 2.2.1 简单居中对齐

使用CSS实现简单的水平垂直居中效果：

```html

```

#### 2.2.2 Flexbox布局

Flexbox是一种强大的布局方式，允许灵活地排列容器内的子元素：

```html

```

#### 2.2.3 Grid布局

Grid布局提供了更复杂的网格系统，适合复杂的设计需求：

```html

```

## 第三章：交互性与动态效果

### 3.1 JavaScript简介

JavaScript是一种脚本语言，主要用于增强网页的交互性和动态性，它可以响应用户的动作，如点击按钮、滚动页面等，并执行相应的操作。

#### 3.1.1 基本语法

变量声明和赋值：

```javascript

let x = 5;

console.log(x);

```

条件语句：

```javascript

if (x > 10) {

console.log("大于10");

} else if (x === 5) {

console.log("等于5");

```

通过以上章节的学习，你可以掌握HTML的基本知识、样式与布局技术以及