overflow,clip,visibility 溢出和剪裁以及可见性

overflow

出于某种原因，一个元素固定为某个特定大小，但内容在元素中放不下。此时可以利用overflow属性来控制这种情况。

值： visible(初始值) | hidden | scroll | auto |

当为默认值visible时，元素的内容在元素框之外也可见，一般会导致内容超出其自己的元素框，但不会改变框的形状。

当设置为scroll,元素的内容会在元素框的边界处剪裁，溢出的内容无法看到，不过在Web浏览器中会使用一个滚动条（或者类似的东西）来访问内容而不会改变元素本身的形状。

如果被设置成hidden，元素的内容会在元素框的边界处剪裁，不过不会提供滚动条，用户也就无法访问被剪裁的部分的内容

内容剪裁

通过使用属性clip可以改变剪裁区域的形状

clip: rect(top,right,bottom,left)

rect(…)的值不是边偏移，而是距元素左上角的距离

元素可见性 visibility

除了溢出和剪裁，还可以控制整个元素的可见性。

值： visible(初始值) | hidden | collapse |

如果元素设置为visibility:visible,当然它是可见的。如果元素设置为visibility:hidden,则处于不可见状态，但是元素还是会影响文档的布局，它原本出现的位置空在那里，只是我们不可见。visibility:collapse值在CSS表显示中使用，如果用于非表元素，则与hidden含义相同