CSS元素隐藏的11种方法
{ display: none; /* 不占据空间,无法点击 */ } { visibility: hidden; /* 占据空间,无法点击 */ } { position: absolute; clip:rect(1px 1px 1px 1px); /* 不占据空间,无法点击 */ } { position: absolute; top: -999em; /* 不占据空间,无法点击 */ } { position: relative; top: -999em; /* 占据空间,无法点击 */ } { position: absolute; visibility: hidden; /* 不占据空间,无法点击 */ } { height: 0; overflow: hidden; /* 不占据空间,无法点击 */ } { opacity: 0; filter:Alpha(opacity=0); /* 占据空间,可以点击 */ } { position: absolute; opacity: 0; filter:Alpha(opacity=0); /* 不占据空间,可以点击 */ } {
zoom: 0.001;
-moz-transform: scale(0);
-webkit-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
/* IE6/IE7/IE9不占据空间,IE8/FireFox/Chrome/Opera占据空间。都无法点击 */
} {
position: absolute;
zoom: 0.001;
-moz-transform: scale(0);
-webkit-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
/* 不占据空间,无法点击 */
}
CSS元素隐藏的11种方法的更多相关文章
- [转]-CSS 元素垂直居中的6种方法
原文地址:http://blog.zhourunsheng.com/2012/03/css-%E5%85%83%E7%B4%A0%E5%9E%82%E7%9B%B4%E5%B1%85%E4%B8%AD ...
- CSS 元素垂直居中的 6种方法
利用CSS进行元素的水平居中,比较简单,行级元素设置其父元素的text-align center,块级元素设置其本身的left 和 right margins为auto即可.本文收集了六种利用css进 ...
- CSS怎么隐藏滚动条(三种方法)
xhtml中隐藏滚动条在用ie6浏览有框架的xhtml页面的时候,默认会水平和垂直滚动条会一起出现,这是ie6的一个bug,在firefox上是正常的,出现的原因是其对XHTML 1.0 transi ...
- 网站开发进阶(十七)Html元素隐藏的几种方式
Html元素隐藏的几种方式 隐藏Html元素的方法最常用的方法有css的display:none,一种方法两种实现方式,感兴趣的朋友可以了解下. 1.使用css style="display ...
- 您可能不知道的CSS元素隐藏“失效”以其妙用
您可能不知道的CSS元素隐藏“失效”以其妙用 by zhangxinxu from http://www.zhangxinxu.com地址:http://www.zhangxinxu.com/word ...
- 您可能不知道的CSS元素隐藏“失效”以其妙用——张鑫旭
一.CSS元素隐藏 在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击.后宫选秀——一个一个看. { display: non ...
- Knockout获取数组元素索引的2种方法,在MVC中实现
原文:Knockout获取数组元素索引的2种方法,在MVC中实现 在遍历数组.集合的时候,通常要获取元素的索引,本篇体验使用Knockout获取索引的2种方法. 假设有这样的一个模型: namespa ...
- after及before伪元素及解决父元素塌陷的几种方法
一.伪类和伪元素 CSS中伪类和伪元素有很多,也很好用!如果熟练使用的话可以解决很多问题 首先明白什么是伪类:伪类是基于当前元素的状态,而不是元素的id class等静态标志,它是动态变化的,它会在一 ...
- 顽石系列:CSS实现垂直居中的五种方法
顽石系列:CSS实现垂直居中的五种方法 在开发过程中,我们可能沿用或者试探性地去使用某种方法实现元素居中,但是对各种居中方法的以及使用场景很不清晰.参考的内容链接大概如下: 行内元素:https:// ...
随机推荐
- django-luffycity-购物车接口
一 基本功能 -添加购物车 -详见代码 -修改课程价格策略 -put或者patch {"course_id": "1", "policy_id&qu ...
- Python标准库 之 turtle(海龟绘图)
turtle库介绍 首先,turtle库是一个点线面的简单图像库(也被人们成为海龟绘图),在Python2.6之后被引入进来,能够完成一些比较简单的几何图像可视化.它就像一个小乌龟,在一个横轴为x.纵 ...
- Codeforces441B_Valera and Fruits(暴力)
Valera and Fruits time limit per test 1 second memory limit per test 256 megabytes input standard in ...
- HTML容易遗忘内容(一)
HTML基础语法: <html> <head> <tiltle>Hello</tiltle> </head> <body bgcolo ...
- 02-django查询
目录 (一)查询 1 .基本查询(等于.大于.包含字符.日期.字段比较.逻辑) 2 .关联查询(即为join查询)(一对多.多对多.一对一) 3 .聚合查询(统计查询) (二)关联对象(已知A表的 ...
- Apache Lucene初探
讲解之前,先来分享一些资料 首先,学习任何一门新的亦或是旧的开源技术,百度其中一二是最简单的办法,先了解其中的大概,思想等等.这里就贡献一个讲解很到位的ppt 这是Lucene4.0的官网文档:htt ...
- JavaScript日期处理
一.Date类型 在讲述常见日期问题之前,先梳理一下Date类型的方法. ECMAScript中的Date类型使用自UTC(Coordinated in Universal Time,国际协调时间)1 ...
- html5 live stream
一.传统的安防监控/流媒体音视频直播基本架构 A/V device 信号采集(yuv/rgb) ---> 转码(h264/265) ---> 网络推送(rtsp/rtmp/http/onv ...
- 《你的SSD可以用100年,你造吗?》总结
来自 http://www.ssdfans.com/?p=1778 上图是闪存的一个基本存储单元,由一种类NMOS的双层浮空栅 (Floating Gate) MOS管组成,用以存储一个bit(SLC ...
- TensorFlow学习笔记(七)Tesnor Board
为了更好的管理.调试和优化神经网络的训练过程,TensorFlow提供了一个可视化工具TensorBoard.TensorBoard可以有效的展示TensorFlow在运行过程中的计算图..各种指标随 ...