日期:2014-05-17  浏览次数:20635 次

div+css样式表中display和visibility区别
   以前对这两个属性的使用也没怎么追究,今天研究了下,下面文章是从网上看到的,把区别说的很明白,特追录进博客。
   从学习div+css样式表到现在用div+css样式表写页面最容易混淆的css样式表属性也莫过于display和visibility。从display和visibility的表现意思来看,没有什么不同,其实它们的差别却是很大的。
首先来讲css样式表的visibility属性
visibility属性用来确定元素是显示还是隐藏,visibility有两个值,分别是visible和hidden;visible表示显示,hidden表示隐藏。写在样式表里边就是这样来表现的 style="visibility:visible \ hidden" 。当visibility被设置为"hidden"的时候,元素虽然被隐藏了,但它仍然占据它原来所在的位置。

    display的属性有很多:而我们最常用的就是block,inline,none。visibility属性是隐藏元素但保持元素的浮动位置,而display实际上是设置元素的浮动特征。
  当display被设置为block(块)时,容器中所有的元素将会被当作一个单独的块,就像<div>元素一样,它会在那个点被放入到页面中。(实际上你可以设置<span>的display:block,使其可以像<div>一样工作。
  将display设置为inline,将使其行为和元素inline一样---即使它是普通的块元素如<div>,它也将会被组合成像<span>那样的输出流。
  最后是display被设置:none,这时元素实际上就从页面中被移走,而且不会留下位置,它下面所在的元素就会被自动跟上填充。