元素隐藏 css
参考:http://www.zhangxinxu.com/wordpress/2011/03/css-%E7%9B%B8%E5%AF%B9%E7%BB%9D%E5%AF%B9relativeabsolute%E5%AE%9A%E4%BD%8D%E7%B3%BB%E5%88%97%EF%BC%88%E4%B8%89%EF%BC%89/
absolute正业之元素隐藏
元素隐藏与显示是我们在页面制作与交互效果实现中非常常见的,如果您只是使用display:none与display:block/inline来实现DOM元素的显隐控制,那你就out了。就元素的显示与隐藏实现,使用display在有些时候算是比较糟糕的方法了。
控制元素显隐的方法很多,但是本文不是讲元素显隐控制的,所以,只讲与absolute相关的一些方法。
absolute属性相关的隐藏方法,我知道的有三种,分别如下:
.hidden{
position:absolute;
top:-9999em;
}
.hidden{
position:absolute;
visibility:hidden;
}
.hidden{
position:absolute;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
}
使用absolute属性控制DOM元素的显隐有三个关键点:页面可用性,回流与渲染,配合JavaScript的控制。
元素隐藏 css的更多相关文章
- CSS中如何让元素隐藏
在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击.下面一个个列出,选一个适合你的 { display: none; /* 不 ...
- css元素隐藏(display:none和visibility:hidden)
在css中, display:none和visibility:hidden都能够使元素隐藏.但是两者所带来的效果完全不同. css display:none 当使用该样式的时候,HTML元素的宽高等 ...
- 您可能不知道的CSS元素隐藏“失效”以其妙用
您可能不知道的CSS元素隐藏“失效”以其妙用 by zhangxinxu from http://www.zhangxinxu.com地址:http://www.zhangxinxu.com/word ...
- 您可能不知道的CSS元素隐藏“失效”以其妙用——张鑫旭
一.CSS元素隐藏 在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击.后宫选秀——一个一个看. { display: non ...
- CSS元素隐藏的display和visibility
一.CSS元素隐藏 在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击. { display: none; /* 不占据空间, ...
- CSS元素隐藏
{ display: none; /* 不占据空间,无法点击 */ } /*************************************************************** ...
- 你可能不知道的CSS元素隐藏“失效”以其妙用
在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击.后宫选秀--一个一个看. { display: none; /* 不占据空 ...
- HTML元素隐藏和显示
在web前端开发过程中,经常会用到隐藏和显示元素的方法 总结:1.通过JS或Jquery控制 2.通过CSS样式控制 一.Js或jquery (jquery为例) 1.隐藏元素 使用 ...
- 使用chrome查看页面元素的css样式
使用chrome查看页面元素的css样式 我们在写页面的时候,可能总是不知道怎么回事,就发现某个元素出现了问题,但是不知道为什么会这样,这时候,就需要使用强大的chrome了!!! 举例说明: 1. ...
随机推荐
- 查看Linux是32位还是64位的方法
发布:JB01 来源:脚本学堂 [大 中 小] 本文介绍下,快速查看linux系统是32位还是64位的方法,有需要的朋友参考下吧. 本节内容:查看linux操作系统的位数 一,方法A:un ...
- android.animation(4) - ObjectAnimator的ofInt(), ofFloat()(转)
一.概述 1.引入 上几篇给大家讲了ValueAnimator,但ValueAnimator有个缺点,就是只能对数值对动画计算.我们要想对哪个控件操作,需要监听动画过程,在监听中对控件操作.这样使用起 ...
- glibc中malloc()的空间overhead
在linux下调用malloc()分配内存的时候,实际占用的内存与请求的内存尺寸的关系是什么呢,这个需要研究一下glibc中malloc()的实现.现在常见linux发行版中带的glibc中采用的都是 ...
- Groovy学习()面向Java开发者的Groovy
第一段Groovy代码 // first groovy program for(int i = 0; i < 3; i++) { System.out.println("ho &quo ...
- BLUETOOTH:HCI层编程
1. HCI层协议概述: Host Controller Interface(HCI) 就是用来沟通Host和Module.Host通常就是PC,Module则是以各种物理连接形式(USB,seri ...
- 解决 Python.h:没有那个文件或目录 错误的方法
http://www.cnblogs.com/yuxc/archive/2012/05/13/2498019.html ———————————————————————————————————————— ...
- html 处理
近期做了一个后台管理网站,后台页面都是Html页面,里面再通过ajax访问后台服务.要做到比较好的用户体验,即:如果用户没有登录或没有权限马上调到登录页面,而不是等到页面加载后再ajax时判断是否登录 ...
- imx6 uboot logo 更改
最近需要更改im6 uboot的开机logo,使用10.1inch, 1024x600,18bit的LCD,期间遇到了很多的问题,记录于此. 参考链接 https://community.nxp.co ...
- multimap 小例子
场景: 按DDX值倒序取前十的板块代码,用 map<float, string, greater<float> > mapBKDDX; 存储时,相同DDX值的板块只能存储第一个 ...
- backbone.js初探(转)
BackBone是JavaScript frameworks for creating MVC-like web applications,最近流行的用来建立单页面web application的工具 ...