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 ...
随机推荐
- array.map
定义和用法 map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值. map() 方法按照原始数组元素顺序依次处理元素. 注意: map() 不会对空数组进行检测. 注意: ma ...
- VUE环境搭建及打包上线
1.vue2.0新手填坑攻略之使用vue-cli搭建vue项目开发环境到项目发布 https://blog.csdn.net/u010020858/article/details/72865101 2 ...
- 几个CSS的黑科技
这里的黑科技其实就是一些CSS中不怎么为人所知但在解决某些问题的时候很溜的属性. border-radius 很多开发者估计都没有正确认识这个border-radius,因为基本上很多人都是这么用的: ...
- 关于GPU的 MAKEFILE
引言 最近由于更换项目,服务器也被换走,估计一时半会用不到GPU了,因此最近想把前一段时间做的一些工作,整理记录一下. 实验室采用的GPU有两款: 1. 服务器上的板卡:NVIDIA的Tesla K2 ...
- jquery常用属性与方法
1..css( )给指定的样式设置样式值: 2..attr(attributeName,value) /.removeAttr(attributeName);给指定的属性设置值 / 清除所有匹配的元素 ...
- ArcSDE空间数据库中SDE用户使用探讨(转)
ArcSDE作为空间数据库解决方案,应用非常广泛,本短文将尝试描述SDE的工作机制,简要说明空间数据 库中SDE用户的使用方法. ArcSDE如何工作 ArcSDE属于中间件技术,其本身并不能够存储空 ...
- Android开发之——依赖冲突Program type already present
前言 实际开发中,为了提高开发速度和效率,总避免不了引用第三方提供的依赖和类库,如果含有相同依赖的类库被我们引用时,而他们的版本又不相同,就有可能会导致一系列问题和异常,本文结合本人时间总结和他人经验 ...
- IEnumerable<T> 用法
//以下参考来自 http://www.cnblogs.com/wilber2013/p/4299529.html
- 【起航计划 019】2015 起航计划 Android APIDemo的魔鬼步伐 18 App->Device Admin 设备管理器 DeviceAdminReceiver DevicePolicyManager PreferenceActivity的使用
Device Admin示例介绍了类DeviceAdminReceiver,DevicePolicyManager和ActivityManager. 使用DevicePolicyManager这个类, ...
- 心得整理之一--RDLC多数据源多表
我将项目中的一部分提炼出来,写了这个Demo. 先说一下需求, 从 API接口, 获取数据源, 调用RDLC 生成PDF文件. (后面还有涉及到使用福昕PDf阅读器进行设置文件自定义内容,以供外部程序 ...