css隐藏元素的几种方法？

1，通过设置display：none

我的世界隐身99999秒指令_我的世界隐身指令手机版

我的世界隐身99999秒指令_我的世界隐身指令手机版

2，input设置type为hidden

3，通过设置层级z-index 使其处于某个div下层来实现隐藏效果

css隐藏元素是网页编写常用的方式，根据我的经验总结了以下几种css隐藏元素的方法.

opacity

opacity属性的隐藏方法主要是将元素透明度opacity设置为0，从而在视觉上就隐藏了元素，但是元素本身依然占据的着原有空间。

浏览器支持来说 IE8以以及更早的版本需要使用filter属性代替，如: filter: Alpha(opacity=80)。

语法: opacity: value|inherit;

value: 透明值。可取值有 0.0 （全透明）和 1.0（不透明）。

inherit：从父元素集成opacity属性的值。

其规定使用的CSS版本为 CSS3

JaScript上的opacity使用方法: object.style.opacity=80。

使用示例：

.hide {
opacity: 0;
}

display

display属性的隐藏方法主要是将元素display值设置为none，将其不可见，连盒子模型也不生成，甚至连也不占用原有空间，使用该属性为none时用户对该元素的作将不可用。

其规定使用的CSS版本为 CSS1。

JaScript上的display隐藏时方法: object.style.display=\"none\"。

JaScript上的display显示时方法: object.style.display=\"除none的其他值\"

display的属性值包含有: \"inline-table\"、\"run-in\"、\"table\"、\"table-caption\"、\"table-cell\"、\"table-column\"、\"table-column-group\"、\"table-row\"、\"table-row-group\"、以及 \"inherit\"。

使用示例：

.hide {

display: none;

}

如果使用jQuery对 带有display: none;的元素进行显示/隐藏使用: $('.element').show() / $('element').hide();

ition

ition属性的隐藏方法主要是将元素定位出可视区域，从而达到隐藏效果。这个属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。

该属性的值包含有: absolute，fixed，releative，static，inherit。

其规定使用的CSS版本为 CSS2。

JaScript上的absolute隐藏时方法: object.style.ition=\"absolute\" "-99999px\",object.style.left=\"-99999px\"。

使用示例：

.hide {

ition: absolute;

top: -99999px;

left: -99999px;

}

visibility

visibility属性的隐藏方法主要是在使用动画效果时使用，将该值设置为 hidden将隐藏元素及其子孙元素，如，我们需要鼠标移动到元素后显示子元素，可在元素 的hover样式设置 元素（或其子孙元素）的visibility的值 为visible即可。

该属性的值包含有:visible，hidden，collapse，inherit。

其规定使用的CSS版本为 CSS2。

JaScript上的absolute隐藏时方法: object.style.visibility=\"hidden\"。

使用示例：

.hide {

visibility: hidden;

}

.show

visibility: visible;

}

overflow

overflow属性的隐藏方法主要是, 使用超出隐藏的方法。

使用示例：

.overflow

overflow: hidden;

}

1、overflow:hidden; 这是防止溢出，也是一种隐藏，只不过是把超出范围的元素隐藏，这种一般用于文字过多或者以及自适应中div没法设置高度时使用

2、display:none;这就是完全的隐藏了，直接消失，任何对该元素直接的用户交互作都不可能生效，被隐藏的元素完全不会占用空间，仿佛元素完全不存在一样。

3、利用opacity透明度来隐藏，opacity设置为0，它只是一种视觉隐藏，元素本身依旧占用它的位置并对网页的布局起到作用，它也同样影响用户交互。在读屏软件中会被识别。

4、ition：元素的定位。把ition：absoluy；top：-4555px；left：-45545px；top和left设置成足够大的负数，相当于把元素放到可视区域外，它不会影响布局，能够让元素保持可作性，在读屏软件上可以被识别。

5、visibility：规定元素 是否可见，一般设置为hidden，它可以很好的隐藏，不会影响用户的交互，在读屏软件中不会被识别。

display和visibility，前者是存在元素可以不占用空间。后者隐藏是占位的。前者可以设为none，后者设为hidden。