css中visibility与display属性区别比较

浏览器支持

所有主流浏览器都支持 visibility 属性。

注释:任何的版本的 internet explorer (包括 ie8)都不支持 "inherit" 和 "collaps教程e" 属性值。

所有主流浏览器都支持 display 属性。

注释:任何版本的 internet explorer (包括 ie8)都不支持 "inherit"、"inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-row"、以及 "table-row-group" 属性值。

说明
display

这个属性用于定义建立布局时元素生成的显示框类型。对于 html 等文档类型,如果使用 display 不谨慎会很危险,因为可能违反 html 中已经定义的显示层次结构。对于 xml,由于 xml 没有内置的这种层次结构,所有 display 是绝对必要的。

visibility

这个属性指定是否显示一个元素生成的元素框。这意味着元素仍占据其本来的空间,不过可以完全不可见。值 collapse 在表中用于从表布局中删除列或行。

总结,

display可以隐藏元素并且不占用页面上的空间,而visibility中是让元素看不到它会占据页面上的空间。

时间: 2024-12-10 12:00:59

css中visibility与display属性区别比较的相关文章

JAVASCRIPT style 中visibility和display之间的区别_javascript技巧

当visibility被设置为"hidden"的时候,元素虽然被隐藏了,但它仍然占据它原来所在的位置. --------------------------------------------------------------- 例子: 复制代码 代码如下: <script language="JavaScript"> function toggleVisibility(me){ if (me.style.visibility=="hidde

CSS中id和class的区别和用法

在一个网页里ID只能使用一次.当然即使一个id在一个网页内被使用多次,其CSS样式仍然可以实现生效,但是一般规定W3C标准是使用一次.因为ID在html里可以赋予html标签特殊的属性如一下JS动作.表单传值等特性所以区别于一个class可以使用多少的次,而一个CSS 命名的id只能使用一次避免一些特定动作.传的表单值的兼容性特性错误即使没有其它JS脚本动作.表单传值特性但是我们也一定执行一个页面只能使用一次. id 选择器以 "#" 来定义,命名CSS选择器. 定义命名css id选

css中Class与ID的区别

个class是用来根据用户定义的标准对一个或多个元素进行定义的.打个比较恰当的比方就是剧本:一个class可以定义剧本中每个人物的故事线,你可以通过css教程,网页特效等来使用这个类.因此你可以在一个页面上使用class="frodo" ,class="gandalf",class="aragorn"来区分不同的故事线.还有一点非常重要的是你可以在一个文档中使用任意次数的 class. 至于id,通常用于定义页面上一个仅出现一次的标记.在对页面排

CSS中em和px的区别

Font-size:1.5em; 其实在国外CSS编写中,使用em作为单位是很多的,一是人性化考虑,二是受到美国劳工部Section508法案的强行限制.那么在网页设计中,常用到的度量单位一共有三种,分别是px/em/pt: *px单位名称为像素,相对长度单位,像素(px)是相对于显示器屏幕分辨率而言的,国内的网站很多都是采用px作为单位的. *em单位名称为相对长度单位.相对于当前对象内文本的字体尺寸.在国外使用的很多.众多先进浏览器[IE除外的基本都是]都支持字体调整. *pt单位名称为点(

JavaScript中的style.display属性操作_javascript技巧

display版本:CSS1/CSS2    兼容性:IE4+   NS4+ 继承性:无   语法:      display   :   block   |   none   |   inline   |   compact   |   marker   |   inline-table   |   list-item   |   run-in   |   table   |table-caption   |   table-cell   |   table-column   |   tabl

css中link和@import的区别分析详解

导入CSS文件主要有两种方式: 链接式(link)  代码如下 复制代码 <link rel="stylesheet" href="style.css" type="text/css"/>   导入式(@impot) <style type="text/css">      @import url("style.css"); </style> 以上是这两种方式的语法区别.

CSS中Class与ID的区别,Margin与Padding的区别

核心提示:Class可以反复使用而ID在一个页面中仅能被使用一次.有可能在很大部分浏览器中反复使用同一个ID不会出现问题,但在标准上这绝对是错误的使用,而且很可能导致某些浏览器的现实问题. Class可以反复使用而ID在一个页面中仅能被使用一次.有可能在很大部分浏览器中反复使用同一个ID不会出现问题,但在标准上这绝对是错误的使用,而且很可能导致某些浏览器的现实问题. 这两个区别都是比较容易混淆的问题,尤其是Class与ID,相信很多人并没有仔细了解过之中区别.以下是我的一些理解: 1. Clas

详细讲解CSS中alt和title属性的困惑

css 浏览器卖主扭曲了标准并且自顾自的不按规则去做一些事,他们可能会造成一些问题,或者至少产生了混淆.例子之一就是一些浏览器处理alt属性(一般会被错误的称作alt标签)的方式,比如拥有大量用户的Windows的IE浏览器. 替换文字(alt text)并不是用来做提示(tool tip),或者更加确切的说,它并不是为图片提供额外说明信息的.相反地,title属性才应该用来为元素提供额外说明信息.这些信息在大部分图像浏览器里显示为提示(tool tip),虽然制造商可以任意采取其他方式渲染ti

css中margin和padding用法区别介绍

用margin还是用padding这个问题是每个学习CSS进阶时的必经之路. CSS边距属性定义元素周围的空间,通过使用单独的属性,可以对上.右.下.左的外边距进行设置,也可以使用简写的外边距属性同时改变所有的外边距. 边界(margin):元素周围生成额外的空白区,"空白区"通常是指其他元素不能出现且父元素背景可见的区域. padding称呼为内边距,其判断的依据即边框离内容正文的距离,而我喜欢CSS权威指南解释的"补白"(或者叫"留白"),因