第二章 html标记语言,第二章-认识HTML标签

# 认识HTML标签

## **语义化标签**

## 标签的用途

在学习网页制作时，常常会听到一个词，语义化，那么什么叫语义化呢？通俗说就是：明白每个标签的用途(在什么情况下使用什么标签)比如：网页上文章的标题可以使用标题标签，网页上的各个栏目的栏目名称也可以使用**标题标签**，文章中的内容的段落就得放在**段落标签**中等等。

## 段落标签

如果想在网页上显示文章，这时就需要使用<p>标签了，把文章的内容放到段落标签中，语法如下:

```

文章内容

```

示例：

```

这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落

这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落

```

效果：


P标签的默认样式，可以从上图看出来，段前和段后都会有空白，如果想去掉这个空白，可以采用CSS去除。

## 文本标签

文本标签没有特殊的语义，它的作用就是为了设置单独的样式。

语法：

```

文本内容

```

示例：

```

HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。超文本...

```

如果想把“超文本标记语言”的字体颜色改为红色，这是就需要使用<span>标签了。

## 标题标签

文章的内容是用<p>标签，那么文章的标题使用什么标签呢？在HTML中可以使用标题标签来定义标题。

标题标签一共有6个，分别为 h1,h2,h3,h4,h5,h6

语法：

```

一级标题

二级标题

三级标题

四级标题

五级标题

六级标题

```

示例：


## DIV标签

在网页制作过程过中，可以把一些独立的逻辑部分划分出来，放在一个`

`标签中，这个标签的作用就相当于一个容器。

语法：

```

内容

```

**确定逻辑部分：**

什么是逻辑部分？它是页面上相互关联的一组元素。如网页中的独立的**栏目版块**，就是一个典型的逻辑部分。如下图所示：图中用红色边框标出的部分就是一个逻辑部分，就可以使用`

`标签作为容器。

## 头部区域

``

## 底部区域

``

## 区段

``

## 侧边栏

``

## *效果标签*

`
`,` `,`

---

`