显示/隐藏DIV的技巧(visibility与display的差别)

使用visibility:hidden属性后,HTML元素(对象)仅仅是在视觉上看不见(完全透明),而它所占据的空间位置仍然存在。也即是说它仍具有高度、宽度等属性值。


  style="visibility: none;"


display:none视为不存在且不加载,即不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失。


  style="display: none;"



关于display: none


一般大型网站都有庞大而又复杂的菜单结构。比如说,你的站点有10个主要的栏目,每个栏目下面又有5-10个次要栏目。当然你可以设计在网站的每一个页面都显示所有的主要栏目和次要栏目的标题。


为什么使用"display: none"属性?


使用"display: none"最主要的一个原因是它很简单,可以保持整个页面代码结构的简洁。你可以把同样的代码放到网站的每个页面里,通过"display: none"属性就可以简单的控制内容是否显示。


使用"Display: None"来隐藏内容是合法的SEO吗


人们担心在网页上使用"display: none"属性会遭受到搜索引擎的惩罚。但这个技术的合理使用太普遍了,以至于很少有站点会因为使用"display: none"属性而遭受到惩罚。而且对搜索引擎来说,就目前的算法来识别出"display: none"是否欺骗搜索引擎,实在是太难了。


是否正常使用了Display:none;这样的隐藏代码,是否利用它来对搜索引擎作弊有一个很简单的判断方法:隐藏的内容如果搜索引擎看得到,用户也看得到的为正常使用隐藏;如果用户看不到,而搜索引擎看得到就可以定性为作弊。


如果恶意使用来隐藏文字等,相信搜索引擎还是可以轻易检查出来的。如通过属性定义内文字比重,文字与标题中关键字比重,文字与属性定义外文字比重等。