#### img引入图片的bug

  * 图片自带3px的底部留白

    + 给图片设置vertical-align:bottom/middle/top

#### 去掉input按下时候的样式

  * outline:none; 去掉边框 

#### 元素类型

  * 块级元素 div p ul li h1-h6 ol dl dt dd

    + 可以设置宽高

    + 盒模型属性都生效

    + 独占一行

  * 内联元素 span b strong i em a u del img 

    + 在同一行显示

    + 不可以设置宽高，宽高由内容撑开

    + padding的左右显示准确，上下显示不准确,margin属性的左右显示准确，上下不准确 

    + margin:0 auto，不生效

    + 可以给内联元素添加一个外层的盒子形成一个大的区域，给该盒子设置text-align:center的居中属性 

    + 添加浮动可以解决内联元素之间的间歇，也能将内联元素的元素类型转换为块元素

  * 内联块元素 input img  

    + 可以设置宽高

    + 在同一行显示

    + 盒模型属性都适用

  * *为什么img和input可以设置宽高？？* 

    + 置换元素：img和input属于置换元素 

      img的src和input的type是不确定的，可以更换

      <img src="">

      <input type="text/password">

    + 非置换元素: 除了置换元素之外  

  * 元素类型的转换 display

    + block 块级元素

    + inline 内联元素

    + inline-block 内联块元素

      - 盒子和盒子之间会产生空隙，两个标签之间的回车导致

        1. 将元素的代码在同一行编写 

        2. 给在同一行的显示的元素的父元素设置font-size:0;该元素设置正常的字体大小

    + **none 隐藏元素 隐藏之后不占位**

      + visibility:hidden; 隐藏元素，隐藏之后占位