在这种情况下使用的最佳css属性是什么

时间:2011-11-23 23:51:34

标签: css visibility

想象一下,我有3行文字,例如下面的内容:

第1行:这是文本1

第2行:这是文字2

第3行:这是文本3

现在我要做的是隐藏第2行,但是我希望第3行向上推到第2行所在的相同位置,当第2行变为可见时,我希望第2行直接向后回到它所在的位置第3行回到原来的位置。

所以我想知道的是哪个是最适合使用的css属性,因为我尝试了visibility:hiddendisplay:none,尽管它们在隐藏第2行和制作Line时都起作用2重新出现,当线2不可见时,它们都不允许线3自动向上移动,因此它在中间留下一个大的间隙,使外观看起来有点草率。

谢谢

2 个答案:

答案 0 :(得分:1)

听起来你回答了自己的问题... visibility:hidden会在元素的布局中保留空间,而display:none却不会,所以在我看来你想要使用{{1}除非你还想操纵元素本身的高度以产生效果。

答案 1 :(得分:1)

第2行的

display: none;应自动向上移动第3行及以下,因为它不会保留空间。你的定位还有另一个问题; @ JCOC611所说的绝对定位是一个不错的选择。

请参阅小提琴:http://jsfiddle.net/NFsN6/2/其中span被每种方法隐藏,因此p容器不再具有可见内容,但展示了2种不同的行为(u)rs。 display: none;时的高度为0且外观相同,但visibility: hidden;

时为空

您能否发布一些可以重现您问题的代码?