# 认识HTML标签 ## **语义化标签** ## 标签的用途 在学习网页制作时，常常会听到一个词，<span style="color:red">语义化</span>，那么什么叫语义化呢？通俗说就是：明白每个标签的用途（在什么情况下使用什么标签）比如：网页上文章的标题可以使用标题标签，网页上的各个栏目的栏目名称也可以使用**标题标签**，文章中的内容的段落就得放在**段落标签**中等等。 ## 段落标签 如果想在网页上显示文章，这时就需要使用&lt;p&gt;标签了，把文章的内容放到段落标签中，语法如下: ``` <p>文章内容</p> ``` 示例： ``` <p> 这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落，这是第一个段落 </p> <p> 这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落，这是第二个段落 </p> ``` 效果：  P标签的默认样式，可以从上图看出来，段前和段后都会有空白，如果想去掉这个空白，可以采用CSS去除。 ## 文本标签 文本标签没有特殊的语义，它的作用就是为了设置单独的样式。 语法： ``` <span>文本内容</span> ``` 示例： ``` <p> HTML的全称为<span style="color:red">超文本标记语言</span>，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。超文本... </p> ``` 如果想把“超文本标记语言”的字体颜色改为红色，这是就需要使用&lt;span&gt;标签了。 ## 标题标签 文章的内容是用&lt;p&gt;标签，那么文章的标题使用什么标签呢？在HTML中可以使用标题标签来定义标题。 标题标签一共有6个，分别为 h1,h2,h3,h4,h5,h6 语法： ``` <h1>一级标题</h1> <h2>二级标题</h2> <h3>三级标题</h3> <h4>四级标题</h4> <h5>五级标题</h5> <h6>六级标题</h6> ``` 示例：  ## DIV标签 在网页制作过程过中，可以把一些独立的逻辑部分划分出来，放在一个`<div>`标签中，这个标签的作用就相当于一个容器。 语法： ``` <div>内容</div> ``` **确定逻辑部分：** 什么是逻辑部分？它是页面上相互关联的一组元素。如网页中的独立的**栏目版块**，就是一个典型的逻辑部分。如下图所示：图中用红色边框标出的部分就是一个逻辑部分，就可以使用`<div>`标签作为容器。 ## 头部区域 `<header></<header>` ## 底部区域 `<footer></<footer>` ## 区段 `<section></<section>` ## 侧边栏 `<aside></<aside>` ## *效果标签* `<br/>`,`&nbsp;`,`<hr/>`