CSS中display与visibility的区别

weizhi1985

weizhi1985

2016-01-29 11:47

CSS中display与visibility的区别,CSS中display与visibility的区别

起因:

前几天在做一个图片无间隙滚动的效果,要利用到一个隐藏的层。

问题:

之间复制以前文字滚动的效果代码(文字滚动时无错误),结果发现页面被拉长了一倍,也就是隐藏的层。

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/html/)

解决:

查CSS手册后发现了隐藏内容原来是有区别的,一种是保留对象的物理空间,一种是不保留。

-------------------------------

display:none

CSS1 隐藏对象。与 visibility 属性的hidden值不同,其不为被隐藏的对象保留其物理空间

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/html/)

visibility:hidden

对象隐藏,与 display 属性不同,此属性为隐藏的对象保留其占据的物理空间。

但是因为使用了visibility:hidden,拉长的内容其实就是那个含有图片的DIV;而改用display:none后就正常了.

展开更多 50%)
分享

猜你喜欢

CSS中display与visibility的区别

Html CSS布局 Div+CSS XHTML
CSS中display与visibility的区别

CSS中 display 与 visibility 的区别

Web开发
CSS中 display 与 visibility 的区别

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

外部引用CSS中 link与@import的区别

Web开发
外部引用CSS中 link与@import的区别

css padding 与margin的区别

Web开发
css padding 与margin的区别

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

CSS3盒模型display:box详解

Web开发
CSS3盒模型display:box详解

认识CSS中absolute与relative

Web开发
认识CSS中absolute与relative

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

《讨鬼传 极》攻手甲讨伐马面视频及配魂推荐

《讨鬼传 极》攻手甲讨伐马面视频及配魂推荐

AutoCAD三维实体入门教程:提取面域中常见问题及解决办法汇总

AutoCAD三维实体入门教程:提取面域中常见问题及解决办法汇总
下拉加载更多内容 ↓