在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);
/* 不占据空间,无法点击 */
}

 

来自:http://www.downcc.com/tech/4034.html

CSS中如何让元素隐藏的更多相关文章

  1. css中实现显示和隐藏(转)

    CSS中的display和visibility      在平时的开发过程中,总是会遇到一些文字在特定的场景下显示或者隐藏来达到我们想要的效果,css中display和visibility语法,他们都 ...

  2. CSS中如果实现元素浮动和清除浮动,看这篇文章就足够了

    浮动基本介绍 在标准文档流中元素分为2种,块级元素和行内元素,如果想让一些元素既要有块级元素的特点也同时保留行内元素特点,只能让这些元素脱离标准文档流即可. 浮动可以让元素脱离标准文档流,可以实现让多 ...

  3. CSS中模拟父元素选择器

    很多情况下,我们需要找到父元素,但可惜的是css中并没有这样的一个选择器. 至于原因可以看张鑫旭的如何在CSS中实现父选择器效果这篇文章. 简单来说这个实现并不是真正的父元素选择器,只是利用其它思路来 ...

  4. css中的伪元素,我今天记住了!o~yeah

    对于伪类和伪元素,我如果要区别它们,一般是使用css中的手册来区分,平常时候也没特意去记,需要用到时打开手册“哦,这个是伪元素,这个是伪类”,我个人觉的某些东西你把它存在网上,不一定要存在头脑中.带着 ...

  5. css鼠标悬浮控制元素隐藏与显示

    在网页开发中经常有需求是鼠标移动到一个元素A身上时,另外一个元素B显示. 如下图 当鼠标移到图片上时,相关的描述从下方显示出来. css实现原理与情景: A 是 B 的父元素 B 默认隐藏 B{opa ...

  6. CSS中怎么设置元素水平垂直居中?

    记录怎么使用text-align与vertical-align属性设置元素在容器中垂直居中对齐.text-align与vertical-align虽然都是设置元素内部对齐方式的,但两者的用法还是有略微 ...

  7. css中块级元素、内联元素(行内元素、内嵌元素)

    Block element 块级元素    顾名思义就是以块显示的元素,高度宽度都是可以设置的.比如我们常用 的<div>.<p>.<ul>默认状态下都是属于块级元 ...

  8. 理解 CSS 中的伪元素 :before 和 :after

    CSS 的主要目的是给 HTML 元素添加样式,然而,在一些案例中给文档添加额外的元素是多余的或是不可能的.事实上 CSS 中有一个特性允许我们添加额外元素而不扰乱文档本身,这就是“伪元素”. 你一定 ...

  9. CSS中为什么有的元素能够设置高度,而有的元素却不能设置高度与宽度?

    可以使用{display:block}将内联元素变为块级元素,同时使用{display:inline}将块级元素变为内联元素. {display:inline-block}又是怎么回事,根据张鑫旭老师 ...

随机推荐

  1. 使用ionic framework创建一个简单的APP

    ionic是一个以cordova为基础的html5前端框架,功能强大,能够快速做出与原生开发相似的应用. 一,安装和配置 1,安装(前提:cordova环境配置完成) npm install -g i ...

  2. mfc 连连看3.2 修改器

    内涵图 连连看3.2下载

  3. 如何用 .Net 开发

    1. 使用最新的技术() 2. 模块拆分,(保持单一,不要把所有的功能都在一起) 3.使用轻量级的外部框架 : :TinyMapper MVC6

  4. 用ADO.NET存入数据库

    点击按钮存入登录名和密码: const string connstr = @"data source=USER-20160705UW\JSQL;initial catalog=Test;in ...

  5. 一次Redis的使用Bug记录(exec)

    博主在一次项目中,使用了工具类中的Redis类,因为该Redis没有封装管道pipeline和exec命令,所以就大笔一挥来了一段__call; 代码如下(其中$this->_connect() ...

  6. 从感知器到SVM

    这篇文章主要是分析感知器和SVM处理分类问题的原理,不涉及求解 感知器: 感知器要解决的是这样的一个二分类问题:给定了一个线性可分的数据集,我们需要找到一个超平面,将该数据集分开.这个超平面的描述如下 ...

  7. mysql解决Value ‘0000-00-00 00:00:00’ can not be represented as java.sql.Timestamp

    同步发布:http://www.yuanrengu.com/index.php/mysqlsolvetimestamp.html 在使用mysql时,如果数据库中的字段类型是timestamp,默认为 ...

  8. 使用Spring配合Junit进行单元测试的总结

    最近公司的项目和自己的项目中都用到了spring集成junit进行单元测试,总结一下几种基本的用法: 1.直接对spring中注入的bean进行测试(以DAO为例): 在测试类上添加@RunWith注 ...

  9. DBSCAN——python实现

    # -*- coding: utf-8 -*- from matplotlib.pyplot import * from collections import defaultdict import r ...

  10. Node ExpressJs server的路径设置

    一.动态页面的路径: app.METHOD(PATH, HANDLER)Where: * app is an instance of express.* METHOD is an HTTP reque ...