HTML的层（div）和块(span)

   大多数 HTML元素被定义为块级元素或内联元素。“块级元素”译为 block level element，“内联元素”译为 inline element。那什么是块级元素，什么又是内联元素呢？它们分别是用来做什么的呢？

一、HTML 块元素

   块级元素在浏览器显示时，通常会以新行来开始（和结束）。

   例子：<h1>, <p>, <ul>, <table>

HTML <div>元素

   HTML <div>元素是块级元素，它是可用于组合其他 HTML 元素的容器,我们把它称为一个层。<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

   如果与 CSS 一同使用，<div>元素可用于对大的内容块设置样式属性。

   <div> 元素的另一个常见的用途是文档布局，它取代了使用表格定义布局的老式方法。但使用 <table>元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。

      <div></div>将内容放到层中，div定义一个矩形,可以将这些内容当成一个整体进行处理，比如，整体隐藏，整体移动。div非常强大和常用，类似于winform 中的panel

二、HTML 内联元素

   内联元素在显示时通常不会以新行开始。

   例子：<b>, <td>, <a>, <img>

HTML <span> 元素

  HTML <span> 元素是内联元素，可用作文本的容器。<span> 元素也没有特定的含义。

  当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。

  div是将内容放到一个矩形的区块中，会影响布局，而span知识把一段内容定义成一个整体进行操作，不影响布局显示。可以是任何形状，不改变原始的排版；

三、效果图：

    代码：

    

    图：

    

四、总结：

   div：定义文章的分区或节

   span：用来组合文档中的行内元素