使用 display属性，可以改变一个框的显示类型，显示类型就决定了一个元素生成框的类型，同时也会影响一个框的行为。
可以把行内元素的 display属性设置为 block，它将生成一个块级框，并表现得像块级元素一样。并且，浏览器会把它作为一个块级框来摆放，它会独占一行，并且可以像处理 div 一样设置样式，如设置其宽度、高度、垂直外边距、垂直内边距。比如，把链接元素 a 的 display属性设置为 block，则整个元素都会成为链接的一部分，用户的鼠标指针停留在元素框的任何位置，都能激活这个链接。
同样，也可以把行内元素的 display属性设置为 inline，让它成为行内元素，此时，width、height 等属性将失效。
不过，需要注意的是，display属性只能改变元素的显示角色，而没有改变一个元素的本质。换句话说，可以让一个段落生成行内框，但并不能让这个段落元素真正变成一个行内元素。行内元素可以是一个块级元素的后代，反过来则不行。
在CSS2.1中，还可以把一个元素的 display属性设置为 inline-block，让它生成一个行内级框，它同时具有块级框和行内框的特征，它像行内框一样在行内水平依次排列，但仍然可以向块级框的一样设置样式，如设置宽度、高度、垂直内边距、垂直外边距。如果未定义行内块的 width 属性，元素框收缩以适应内容。也就是说，元素框的宽度刚好足够包含其内容，而没有多余的空间。
也可以把元素的 display属性设置为 none，让元素根本没有框，这样的话，该框及其所有内容就不再显示，也不占据文档中的空间。
还可以通过 visibility 属性设置元素的可见性。设置为 visible 时，让对象可见；设置为 hidden 时，把对象隐藏，让其不可见。
说明：display:none 与 visibility:hidden的区别
当为一个元素设置 display: none 或 visibility: hidden时，元素都不会被显示在页面上，但它们之间却有本质上的区别。
display: none 的元素，会不留痕迹的从页面上消失，也不占用页面上的空间；而 visibility: hidden 的元素，则只是阻止浏览器显示其内容，让其不可见而已，它在页面上占据的空间依然会保留，会在原来的位置留下一个洞。
对于绝对定位的元素而言，它已经脱离文档流，display: none 和 visibility: hidden 的效果是一样的。
关于作者
歪脖先生，十五年以上软件开发经验，酷爱Web开发，精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等，著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》，并全部在 GitHub 上开源。
