`
ayue222
  • 浏览: 48056 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

CSS clip 属性

阅读更多
定义
clip 属性设置元素的形状。

当一幅图像的尺寸大于包含它的元素时会发生什么呢?"clip" 属性允许您规定一个元素的可见尺寸,这样此元素就会被修剪并显示为这个形状。

继承性:No

说明
这个属性用于定义一个剪裁矩形。对于一个绝对定义元素,在这个矩形内的内容才可见。出了这个剪裁区域的内容会根据 overflow 的值来处理。剪裁区域可能比元素的内容区大,也可能比内容区小。

Java  script  语法
CSS 属性也可通过一段 Java  script  被动态地改变。

脚本语法:object.style.clip="rect(0px,50px,50px,0px)"
在我们的 HTML DOM 教程中,您可以找到更多有关 clip 属性 的细节。

在我们的 HTML DOM 教程中,您也可以找到完整的 Style 对象参考手册。

例子img   {   clip: rect(10px, 5px, 10px, 5px)   }
可能的值 值 描述
shape 设置元素的形状。合法的形状值是:rect (top, right, bottom, left)
auto 默认。浏览器可设置元素的形状。
分享到:
评论

相关推荐

    CSS clip属性全知道

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

    css3 clip属性和jquery打造响应式背景图片放大动画

    这个效果使用css3 clip属性、CSS transitions和jQuery完成。当点击一张图片后,图片放大到全屏的动画效果,共有两种效果。

    css3 clip实现圆环进度条的示例代码

    CSS中有一个属性叫做clip,为修剪,剪裁之意。 clip 属性剪裁绝对定位元素。这个属性用于定义一个剪裁矩形。对于一个绝对定义元素,在这个矩形内的内容才可见。出了这个剪裁区域的内容会根据 overflow 的值来处理。 ...

    CSS教程:clip属性详细讲解

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

    详解css中background-clip属性的作用

    主要介绍了css中background-clip属性的作用,background-clip属性的通俗作用就是指定元素背景所在的区域,对css中background-clip属性的相关知识感兴趣的朋友一起看看吧

    CSS中clip-path属性的使用详解

    主要介绍了CSS中clip-path属性的使用详解,clip-path属性可以创建一个只有元素的部分区域可以显示的剪切区域。非常具有实用价值,需要的朋友可以参考下

    在css3中background-clip属性与background-origin属性的用法介绍

    background-clip 与 background-origin是css3中引入的两个跟元素背景相关的属性,它们有相同的可选值,即border、padding、content三种,而且这两个属性表示的都是元素背景与元素边框、补白(padding)和内容区域之间...

    CSS裁剪属性clip使用的实例教程

    本文将介绍关于clip属性的相关知识 定义 一个绝对定位或固定定位元素通过使用属性clip可以改变剪裁区域的形状,但并不改变元素本身的宽高属性 clip  值: rect(top,right,bottom,left) | auto | inherit  初始值: ...

    CSS中的clip-path区域裁剪属性使用教程

    CSS中的clip-path能够让你指定一个网页元素的显示区域,而不是缺省的显示全部。 CSS Code复制内容到剪贴板 .clip-me {  /* 已被标志为不推荐使用的写法 */  position: absolute; /* 需要 absolute 和...

    CSS clip元素rect属性中各个参数的含义示例介绍

    clip"属性允许您规定一个元素的可见尺寸,这样此元素就会被修剪并显示为这个形状,这个属性用于定义一个剪裁矩形,下面有个不错的示例,大家可以参考下

    浅谈css中的clip裁剪用法

    clip 属性是用来设置元素的形状。用来剪裁绝对定位元素(absolute or fixed)。 clip有三种取值:auto |inherit|rect。inherit是继承,ie不支持这个属性, auto是默认 前两个基本属于打酱油的,我们主要来说一下clip的...

    美工之路 网页设计视频教程CSS篇-35.盒子Box:clip属性.rar

    美工之路系列视频是为那些想从事网页前台设计的设计师们和网页设计爱好者量身定制的,本教程包含4个部分:HTML篇,CSS篇,Javascript篇和XML篇.不仅适用于网页设计的初学者,对中级以上水平的人员也有一定参考价值,使...

    滴滴等待loading CSS 实现

    滴滴等待loading CSS 的实现。用css的clip属性实现通过旋转截取

    jQuery和css3 background-clip文字特效

    一款使用jQuery和css3 background-clip制作的文字特效插件。该文字特效有颜色渐变,背景图片变化等多种效果。注意只有webkit内容的浏览器才支持css3 background-clip属性。

    CSS和CSS3思维导图(xmind版)

    css3和css,在编写code的时候,除了对一些css3中新出现的属性设置,其它完全一样。 CSS3新增属性 box-shadow(阴影效果) border-colors(为边框设置多种颜色)  boder-image(图片边框) text-shadow(文本阴影) ...

Global site tag (gtag.js) - Google Analytics