一.标签

      块级元素的特点:

      1.一人独占一整行或者多行可以对其设置高度,宽度对齐等属性,常用于网页布局结构的搭建

              常见的块元素{  h1-6     p   div   ul  ol  li

                其中 div 是最典型的元素

        css+div的布局模式

              块级元素的特点:

                   1.总是以新行开始

                   2.高度,行高,外边距以及内边距都可以控制

                   3.宽度默认是容器的100%

                    5.可以容纳行内元素和其他块元素

  行内元素

                不占独立的区域仅靠自身的字体大小和图像尺寸支持结构

                 一般不可以设置宽度,高度,对齐等属性,常用于控制页面中文本的样式

行内元素的特点 

                     1.相邻行内元素在一行上,

                      2.高宽无效,但在水平方向的padding和margin可以设置

                       垂直方向无效

                      3.默认宽度就是它本身内容的宽度

                       4.行内元素只能容纳文本或者其他行内元素. a特殊

      span最典型的行内元素

       常见的行内元素:a   strong   b  em   i  del   s  ins  u   span

      块级元素独占一行有宽高,行内元素一行只能放多个无宽高

行内块元素

常见的行内块元素:

                img   input   td

行内块元素:一行放多个.可以改宽高

行内块元素的特点:

                 1.和相邻行内元素(行内块)在一行上,但是之间会有空白间隙

                 2.默认宽度就是它本身内容的宽度

                 3.高度和行高,外边距以及内边距都可以控制

标签的模式 可以相互转换

二.标签之间相互转换

div{display:inline;//将块级元素转为行内元素}div{display:block;//将行内元素转为块级元素}div{display:inline-block;//将块级元素转为行内块级元素  缺点是中间有缝隙}

三.总结

网页布局就是摆盒子的过程

行内,行内块元素可以作为文字对上级元素进行居中对齐  使用 text-aligin时候

line-height:50px;   行高等于盒子高度,可以让单行文本垂直居中