css隐藏元素
在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间;有的可以响应点击,有的不能响应点击。下面一个个列出,选一个适合你的
{ display: none; /* 不占据空间,无法点击 */ }
{ visibility: hidden; /* 占据空间,无法点击 */ }
{ 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隐藏元素的更多相关文章
- CSS隐藏元素的几种方法
使用CSS隐藏元素的方法很多,在这里简单总结一下: 1.display:none display:none 应该是最常用的一种隐藏元素的方法,使用该方法隐藏的元素脱离文档流不占据空间,不会被浏览器解析 ...
- CSS隐藏元素的几种妙法
一说起CSS隐藏元素,我想大部分小伙伴们都会想到的第一种方法就是设置display为none.这是最为人所熟知也是最常用的方法.我相信还有不少人想到使用设置visibility为hidden来隐藏元素 ...
- CSS“隐藏”元素的几种方法的对比
本文地址:http://luopq.com/2016/02/15/css-tricks-of-hide-element/,转载请注明 一说起CSS隐藏元素,我想大部分小伙伴们都会想到的第一种方法就是设 ...
- css隐藏元素的六类13种方法
隐藏元素的方法 隐藏元素的方法可以总结为六类:直接隐藏.对溢出内容隐藏.对元素透明度进行调整.将元素移除当前屏幕.对元素的层级关系进行调整.对元素进行裁剪 只有对元素的透明度进行调整才可以点击,其余都 ...
- css隐藏元素的几种方法与区别
css隐藏元素的几种方法与区别 一:display:none;隐藏不占位 display 除了不能加入 CSS3 动画豪华大餐之外,基本效果卓越,没什么让人诟病的地方. 二:position:abso ...
- 【前端】CSS隐藏元素的方法和区别
CSS隐藏元素的方法和区别 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- 有趣的css—隐藏元素的7种思路
css隐藏元素的7种思路 前言 display.visibility.opacity三个属性隐藏元素之间的异同点一直是前端面试面试的常考题. 属性 值 是否在页面上显示 注册点击事件是否有效 是否存在 ...
- 用css隐藏元素的5种方法
.green { width: 100px; height: 100px; background-color: #a0ee00; text-align: center; float: left; ma ...
- 不同场景下使用CSS隐藏元素
使用 CSS 让元素不可见的方法很多,剪裁.定位到屏幕外.明度变化等都是可以的.虽然它们都是肉眼不可见,但背后却在多个维度上都有差别. 元素不可见,同时不占据空间.辅助设备无法访问.不渲染 使用 sc ...
- CSS隐藏元素的五种方法
1.opacity:0 2.visibility:hidden 3.diaplay:none 4.position:absolute display display属性依照词义真正隐藏元素.将disp ...
随机推荐
- 常见的几种web攻击方式
一.Dos攻击(Denial of Service attack) 是一种针对服务器的能够让服务器呈现静止状态的攻击方式.有时候也加服务停止攻击或拒绝服务攻击.其原理就是发送大量的合法请求到服务器,服 ...
- 数据结构---Java---有序数组
[自定义有序数组] 查找算法: 线性查找算法:依次对比查询: 二分查找算法:必须是有序: insert:要插入的value与数组中每个元素进行比较,当有值>value时,此处的index之后的元 ...
- javassist fr8.0破解
主要是破解连接数的. 已破解的jar:http://download.csdn.net/download/wolf12/9834152 public static void main(String[] ...
- 17082 两个有序数序列中找第k小(优先做) O(logn)
17082 两个有序数序列中找第k小(优先做) 时间限制:1000MS 内存限制:65535K提交次数:0 通过次数:0 题型: 编程题 语言: G++;GCC;VC Description 已 ...
- 定义与声明、头文件与extern总结(转)
本文转自: http://lpy999.blog.163.com/blog/static/117372061201182051413310/ http://blog.csdn.net/feitianx ...
- Windows Server 2008下的FTP服务器设置
今天刚在新服务器上部署好Windows Server 2008,同时安装好了SQL,基本上还算顺利.没想到在设置FTP服务器的时候遇到了麻烦.按照以往的经验,安装好Serv-U以后,同时在防火墙设置里 ...
- Session [php]
1.启动会话 session_start() 通过session_register()函数创建会话 session_register()函数用来为会话登录一个变量来隐含地启动会话,但要求php.ini ...
- struts2的java.lang.NoSuchMethodException异常处理
1. 你有没有试试看 其它的方法能不能用,要是都是这种情况的话,可能是你的Action类没有继承structs里面的DispatchAction或者其它的类.还有你注意下方法的参数列表,类型顺序要正确 ...
- Spring Boot集成Reactor事件处理框架的简单示例
1. Reactor简介 Reactor 是 Spring 社区发布的基于事件驱动的异步框架,不仅解耦了程序之间的强调用关系,而且有效提升了系统的多线程并发处理能力. 2. Spring Boot集成 ...
- C# 和 Linux 时间戳转换
/// <summary> /// 时间戳转为C#格式时间 /// </summary> /// <par ...