如果left >= right或者bottom <= top,则元素会被完全裁掉而不可见,即“隐藏”。通过这种方式隐藏的元素是可以被屏幕阅读器等辅助设备识别的,从而提高了页面的可用性。

Img{position:absolute;clip:rect(top right bottom left)}

clip 属性剪裁绝对定位元素的更多相关文章

  1. css3中clip属性

    clip 属性用来设置元素的形状.用来剪裁绝对定位元素. 当一幅图像的尺寸大于包含它的元素时,"clip" 属性允许规定一个元素的可见尺寸,这样此元素就会被修剪并显示在这个元素中. ...

  2. CSS Clip属性

    Clip属性在W3C官网是这样进行描述的:“通过对元素进行剪切来控制元素的可显示区域,默认情况下,元素是不进行任何剪切的,但是也有可能剪切区域也显示的设置了clip属性”. .selector { c ...

  3. CSS元素:clip属性作用说明

    clip属性是一个比较有用的属性,但往往在实际应用中,并不多见,介绍的也很少.应用clip属性需要注意的两点: 一.clip属性必须和定位属性postion一起使用才能生效. 二.clip裁切的计算坐 ...

  4. pointer-events的css属性。使用该属性可以决定是否能穿透绝对定位元素去触发下面元素的某些行为

    pointer-events的css属性.使用该属性可以决定是否能穿透绝对定位元素去触发下面元素的某些行为,比如当一个元素盖住了某个点击事件时可用. 现在Firefox3.6+/Safari4+/Ch ...

  5. WPF 元素裁剪 Clip 属性

    本文介绍如何在 WPF 使用 Clip 裁剪元素 在 WPF 的 UIElement 提供了 Clip 属性,这个属性默认是空,但是如果设置了这个属性就会对元素进行裁剪 这个属性是一个 Geometr ...

  6. 将CSS CLIP属性应用在:扩展覆盖效果

    我们想要展示如何利用CSS3 clip属性制作一种简单而整洁的扩展效果,当点击一个box元素时实现平稳过渡.这个想法是为了实现某种叠加效果,好像它实际上在各个元素的下面.点击其中一个元素将创建一个切断 ...

  7. 理解CSS Clip属性及用法

    应用Clip属性实现的一个简单效果图: 样式写法: .my-element { position: absolute; clip: rect(10px  350px  170px  0); /* IE ...

  8. 转: Firefox 浏览器对 TABLE 中绝对定位元素包含块的判定有错误

    标准参考 元素的包含块 W3C CSS2.1 规范中规定,绝对定位元素的包含块(containing block),由离它最近的 position 特性值是 "absolute". ...

  9. 背水一战 Windows 10 (71) - 控件(控件基类): UIElement - RenderTransform(2D变换), Clip(剪裁)

    [源码下载] 背水一战 Windows 10 (71) - 控件(控件基类): UIElement - RenderTransform(2D变换), Clip(剪裁) 作者:webabcd 介绍背水一 ...

随机推荐

  1. 简化版c语言文法

    <程序> → <外部声明> | <程序的外部声明> <标识符类型> → <无类型> | <字符> | <整型> | ...

  2. css3实现逐渐变大的圆填充div背景的效果

    手机端现在的一些应用会运用上这样一个效果,就是duang的一下出现一个圆变大直到填充整个div,动感十足. 想到css3的scale属性,就自己来实现一下. <div id="bcd& ...

  3. [CentOS] 解决 crontab 无法读取环境变量的问题

    参考资料:http://blog.slogra.com/post-238.html 1. 问题描述 一段数据处理的 shell 程序,在 shell 中手动运行,可以正确执行.但是,把它放在 cron ...

  4. JavaEE Spring

    1.  Spring以一己之力撼动了Sun公司的JavaEE传统重量级框架(EJB),逐渐成为使用最多的JavaEE企业应用开发框架. 2.  Spring是分层的JavaEE应用一站式的轻量级开源框 ...

  5. [html]head区域编写规范

    一.必须加入的标签 1.meta 2.title 3.css 4.字符集 <meta charset="utf-8"/> 二.可加入的标签 1.设定网页到期时间,一旦网 ...

  6. Git 分支

    Git 保存的不是文件的变化或者差异,而是一系列不同时刻的文件快照,某一次的提交指向这处时刻的文件快照,看起来就像每次提交都保存了当时的文件,连续的提交形成一条长链 分支 指向某一个特定的提交,不同的 ...

  7. 线性控制原理——PID算法应用

    使用控制系统(PID)控制被控对象 PID控制的三要素:控制器,被控对象,反馈器.控制器就是一个数学模型,就PID来说,等同于PID算法.是对反馈量的一个处理与输出.通俗的说就是对于每个被控的量,我的 ...

  8. C++小项目:directx11图形程序(四):d3dclass

    主菜终于来了.这个d3dclass主要做的工作是dx11图形程序的初始化工作,它将创建显示表面交换链,d3d设备,d3d设备上下文,渲染目标表面,深度模板缓存:设置视口,生成投影矩阵. D3D设备:可 ...

  9. 杭电ACM1005

    Number Sequence Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)T ...

  10. js拖拽效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...