显示display 与 可见性visibility

显示 Display

• display属性用于设置一个元素该如何显示
• display属性有以下4个：
  
  • none 隐藏元素，元素不占任何空间
  • block 将元素以块元素的方式显示
  • inline 将元素以内联元素的方式显示
  • inline-block 将元素以内联块元素，表现为同行显示并可修改宽 高 内外边距等属性，如我们常将ul显示为display：inline-block，原本垂直的列表就可以水平显示了，以此来制作导航栏

可见性 visibility

• visibility属性指定了一个元素的可见性
• 常用属性：
  
  • hidden 隐藏元素，元素仍然占用空间，注意与display:none的区别
  • visible 可见

块级元素 block

• 块级元素总是独占一行
• width height padding margin都是可控制的
• 常见的块级元素：div p table form h1-h6 dl ol ul li

内联元素 inline

• 和相邻的内联元素在同一行
• width height padding-top/bottom margin-/top/bottom不可变，是根据里面的文字或图片自适应大小的
• 常见的内联元素：a input select span