clip

clip 在学前端的小伙伴前,估计是很少用到的,代码中也是很少看见的,但是,样式中有这样的代码,下面让我们来讲讲他吧!

这个我也做了很久的开发没碰到过这个属性,知道我在一个项目中,有一个功能点,我在检查元素的时候,看别人的代码的时候,

发现了这个样式,很好奇,所以就搜了一下,但是我用了一下,发现没用,就在其他人的博客,还有w3scholl仔细看了一下,

才发现一个问题

他的作用功能是剪裁,但是只在绝对定位元素下才起作用的,例:position: absolute;等

.hhh{
position:absolute;
clip: rect(0 76px 38px 0);
}
rect括号里的参数:

第一个参数:剪裁矩形距离父元素顶部的长度。

第二个参数:剪裁矩形距离父元素左边的长度 + 矩形宽度。

第三个参数:剪裁矩形距离父元素顶部的长度 + 矩形高度。

第四个参数:剪裁矩形距离父元素左边的长度。

css clip样式 属性功能及作用的更多相关文章

  1. 0010 CSS字体样式属性:font-size、font-family、Unicode字体、font-weight、font-style、综合设置、color、 text-align、line-height、text-indent、text-decoration、、、

    CSS字体样式属性.调试工具 目标 应用 使用css字体样式完成对字体的设置 使用css外观属性给页面元素添加样式 使用常用的emment语法 能够使用开发人员工具代码调试 1.font字体 1.1 ...

  2. css常用样式属性详细介绍

    对于初学css的来说,肯定会觉得这么多样式不好记,而且记住了也容易忘,其实刚开始我们不用去记这么多的样式,确实是记了也会忘,刚开始只需记住一些常用的就可以了,然后在慢慢的使用过程当中接触并学习一些高级 ...

  3. CSS字体样式属性

    font-size 字号大小 一般推荐使用相对长度(px ,em),不推荐使用绝对长度(in,cmm,mm,pt) font-family 字体 1.可以同时指定多个字体,中间用英文状态的逗号隔开,英 ...

  4. CSS常用样式属性

    1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...

  5. CSS尺寸样式属性

    尺寸样式属性介绍 属性 值 含义 height auto:自动,浏览器会自动计算高度length:使用px定义高度%:基于包含它的块级对象的百分比高度 设置元素高度 width 同上 设置元素的宽度 ...

  6. css内容样式属性

    设置元素的最大高度.最小高度.最大宽度.最小宽度,用max-height.min-height.max-width.min-width. visibility:设置元素是否可见.visible和hid ...

  7. CSS之样式属性(背景固定、圆形头像、模态框)

    CSS属性 一.宽和高 width属性可以为元素设置宽度. height属性可以为元素设置高度. 块级标签才能设置宽度,内联标签的宽度由内容来决定. div {width: 1000px;backgr ...

  8. CSS 所有样式属性大复习

    1.背景与前景 /*背景色,样式表优先级高*/ background-image:url(路径);    /*设置背景图片(默认)*/ background-attachment:fixed;     ...

  9. CSS哪些样式属性可以继承

    不可继承的:display.margin.border.padding.background.height.min-height.max- height.width.min-width.max-wid ...

随机推荐

  1. 二.什么是Promise

    二.什么是Promise 1.理解 2.promise 的状态改变 3.promise的基本流程 4.promise的基本使用 1.理解 抽象表达: Promise 是JS 中进行异步编程的新的解决方 ...

  2. Mysql - 整数类型的存储字节数和范围

    MySQL 整数类型的存储字节数和范围 type 存储字节数 有符号最小值 无符号最小值 有符号最大值 无符号最大值 TINYINT 1 -128 0 127 255 SMALLINT 2 -3276 ...

  3. c++学习笔记3(动态内存分配)

    为了效率,需要按需去进行动态内存分配,在c中,可以用malloc去实现动态内存分配,而在c++中,则用new运算符去实现. 用法一:动态分配一个变量的存储空间 p=new T T为类型名 P则为T*类 ...

  4. C#中OnLoad事件和Form1_Load事件的区别

    在学习<GDI+高级编程>第二章的过程中遇到一个疑问,就是为何有的代码用的是覆写一个OnLoad事件,而平日里我用的一般是Form1_Load事件,这两个函数很相近,但是具体有什么关系呢? ...

  5. dart系列之:dart类中的泛型

    目录 简介 为什么要用泛型 怎么使用泛型 类型擦除 泛型的继承 泛型方法 总结 简介 熟悉JAVA的朋友可能知道,JAVA在8中引入了泛型的概念.什么是泛型呢?泛型就是一种通用的类型格式,一般用在集合 ...

  6. python实现调用摄像头或打开视频文件

    目录: (一)调用摄像头或打开视频文件代码实现 (二)说明和补充 (一)调用摄像头或打开视频文件代码实现 1 # -*- coding=GBK -*- 2 import cv2 as cv 3 4 5 ...

  7. [hdu7011]被EI加0了

    注意到仅关心于权值大小,预处理出$F_{i}(n)$​​​​表示$a_{1},a_{2},...,a_{n}$​​​​中恰填$i$​​​​​​种不同的数的方案数,那么显然答案即为$\sum_{i=1} ...

  8. [spojRNG]Random Number Generator

    先将所有数加上Ri,即变为区间[0,2Ri],考虑容斥,将区间容斥为[0,+oo)-[2Ri,+oo),然后对[2Ri,+oo)令$bi=ai-2Ri$,相当于范围都是[0,+oo)问题转化为求n个正 ...

  9. littlevgl架构浅析

    一.   littlevgl有几个线程,作用是什么? 三个,主线程一个,和在主线程的hal_init函数中创建的另两个sdl线程. 主线程完成一系列初始化工作后,循环每10ms调用在lv_init函数 ...

  10. 如何利用 JuiceFS 的性能工具做文件系统分析和调优

    JuiceFS 是一款面向云原生环境设计的高性能 POSIX 文件系统,在 AGPL v3.0 开源协议下发布.作为一个云上的分布式文件系统,任何存入 JuiceFS 的数据都会按照一定规则拆分成数据 ...