第九章 body中的标签（四）
一、div标签
1.1 概要
<div> 标签本身并不代表任何东西，使用它可以标记区域，例如样式化 (使用 class 或 id 属性)、用不同的语言 (使用 lang 属性) 标记 HTML 文档的某个部分，等等。
尽管<div>语义不清，但却是前端页面布局最常用、最重要的标签。
重要的原因在于布局经常要使用。
- 1．使用 DIV 标签 作为容器。 我们主要把它用在 DIV（division）tag 上。当你把文字，图象，或其他的放在 DIV 中，它可称作为“DIV block”，或“DIV element”或“CSS-layer”，或干脆叫“layer”。而中文我们把它称作“层次”。所以当你以后看到这些名词的时候，你就知道它们是指一段在 DIV 中的 HTML。 使用 DIV 的方法跟使用其他 tag 的方法一样：
- 2．绝对定位和相对定位 （position）
- 3．定位单元的控制 （width、height、visiblility）
- 4．单元层次 （z-index）
- 5．剪辑绝对定位单元 （clip）
- 6．控制单元溢出 （overflow）
div就是层的意思，目前div＋css＋js是大网站的遵循web开发标准，并且开发速度块，分工明确的一种网页设计开发方式。
也可以这样理解，css+div就是摒弃了传统的表格布局方式，完全采用CSS控制DIV。
div就是层的意思，使用DW就知道了，一般定义一块内容是可以在网页普通的html之上的一层。 一般css是用来控制div显示的，比如在什么为止，什么颜色，什么图片等等。
layer = 层。div应解释成盒子或者块，而且它也并不是在网页普通HTML之上的，而是在其中的 结构（HTML）+ 表现（css）+ 行为(Javascript)
目前div＋css＋js是大网站的遵循web开发标准，并且开发速度块，分工明确的一种网页设计开发方式。
1.2 使用
div标签的使用相当灵活，你可以通过div来模拟很多的标签，如a标签、p标签、hx标签、span标签等待。通过js+css可以完成很多意想不到的的效果。
<div class="food">
<ul>
<li>水果</li>
<li>米饭</li>
...
</ul>
</div>
通过增加类名 class，可以把其归为一类，即容器（盒子）。
1.3 标签定义及使用说明
- <div> 标签定义 HTML 文档中的一个分隔区块或者一个区域部分。
- <div>标签常用于组合块级元素，以便通过 CSS 来对这些元素进行格式化。
- 可以对同一个 <div> 标签同时应用 class 或 id 属性，但通常情况下我们偏向于只使用其中一种。
- 为了避免麻烦，您可以不必为每一个 <div> 标签都加上 class 或 id 属性。
提示：<div> 元素经常与 CSS 一起使用，用来布局网页。
Star：默认情况下，浏览器通常会在 <div> 元素前后放置一个换行符。然而，您可以通过使用 CSS 改变这种情况。
#二、span标签 ##2.1 概要 <span>标签内的内容独立于文档，当对该标签应用样式时，包含在其中的内容会呈现出不同的视觉效果。
2.2 用法
使用 <span> 元素对文本中的一部分进行着色：
定义橘色字体。
```html定义橘色字体。
``` ##2.3 特点 <span> 用于对文档中的行内元素进行组合。<span> 标签没有固定的格式表现。当对它应用样式时，它才会产生视觉上的变化。如果不对 应用样式，那么 元素中的文本与其他文本不会任何视觉上的差异。
<span> 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。
三、button标签
3.1 概要
<button> 标签用来设置 HTML 中的按钮。
在 <button> 元素内部，您可以放置内容，比如文本或图像。这是该元素与使用 <input> 元素创建的按钮之间的不同之处。
提示：请始终为 <button> 元素规定 type 属性。不同的浏览器对 <button> 元素的 type 属性使用不同的默认值。
3.2 用法
示例：
<button type="button">点我</button>
