css clip样式 属性功能及作用
clip
clip 在学前端的小伙伴前,估计是很少用到的,代码中也是很少看见的,但是,样式中有这样的代码,下面让我们来讲讲他吧!
这个我也做了很久的开发没碰到过这个属性,知道我在一个项目中,有一个功能点,我在检查元素的时候,看别人的代码的时候,
发现了这个样式,很好奇,所以就搜了一下,但是我用了一下,发现没用,就在其他人的博客,还有w3scholl仔细看了一下,
才发现一个问题

他的作用功能是剪裁,但是只在绝对定位元素下才起作用的,例:position: absolute;等
.hhh{
position:absolute;
clip: rect(0 76px 38px 0);
}
rect括号里的参数:
第一个参数:剪裁矩形距离父元素顶部的长度。
第二个参数:剪裁矩形距离父元素左边的长度 + 矩形宽度。
第三个参数:剪裁矩形距离父元素顶部的长度 + 矩形高度。
第四个参数:剪裁矩形距离父元素左边的长度。
css clip样式 属性功能及作用的更多相关文章
- 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 ...
- css常用样式属性详细介绍
对于初学css的来说,肯定会觉得这么多样式不好记,而且记住了也容易忘,其实刚开始我们不用去记这么多的样式,确实是记了也会忘,刚开始只需记住一些常用的就可以了,然后在慢慢的使用过程当中接触并学习一些高级 ...
- CSS字体样式属性
font-size 字号大小 一般推荐使用相对长度(px ,em),不推荐使用绝对长度(in,cmm,mm,pt) font-family 字体 1.可以同时指定多个字体,中间用英文状态的逗号隔开,英 ...
- CSS常用样式属性
1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...
- CSS尺寸样式属性
尺寸样式属性介绍 属性 值 含义 height auto:自动,浏览器会自动计算高度length:使用px定义高度%:基于包含它的块级对象的百分比高度 设置元素高度 width 同上 设置元素的宽度 ...
- css内容样式属性
设置元素的最大高度.最小高度.最大宽度.最小宽度,用max-height.min-height.max-width.min-width. visibility:设置元素是否可见.visible和hid ...
- CSS之样式属性(背景固定、圆形头像、模态框)
CSS属性 一.宽和高 width属性可以为元素设置宽度. height属性可以为元素设置高度. 块级标签才能设置宽度,内联标签的宽度由内容来决定. div {width: 1000px;backgr ...
- CSS 所有样式属性大复习
1.背景与前景 /*背景色,样式表优先级高*/ background-image:url(路径); /*设置背景图片(默认)*/ background-attachment:fixed; ...
- CSS哪些样式属性可以继承
不可继承的:display.margin.border.padding.background.height.min-height.max- height.width.min-width.max-wid ...
随机推荐
- hudi clustering 数据聚集(一)
概要 数据湖的业务场景主要包括对数据库.日志.文件的分析,而管理数据湖有两点比较重要:写入的吞吐量和查询性能,这里主要说明以下问题: 1.为了获得更好的写入吞吐量,通常把数据直接写入文件中,这种情况下 ...
- ubuntu install redis
ubuntu install redis apt-get update apt-get install redis-server redis-server --daemonize yes
- JSRE中的多任务与多线程
前言 这几天在爱智官网看了下JSRE其他的Api,看了一个比较有意思的模块 - 多任务模块task,大致看了下他们的接口说明和案例,感觉和多线程差不多,然后就准备去看下实现方式,找了很久没有找到源 ...
- python实现直方图的应用
目录: (一)调节图片对比度(均衡化) (1)全局直方图均衡化------equalizeHist (2)自适应的局部的直方图均衡化------createCLAHE (二)图片的相似度比较 (三)直 ...
- Windows操作系统安全加固基线检测脚本
一.背景信息 在我们的安全运维工作中经常需要进行安全基线配置和检查,所谓的安全基线配置就是系统的最基础的安全配置,安全基线检查涉及操作系统.中间件.数据库.甚至是交换机等网络基础设备的检查,面对如此繁 ...
- JVM 是用什么语言写的?
JAVA中就虚拟机是其它语言开发的,用的是C语言+汇编语言 基于此之上就是JAVA本身了 虚拟机只起到解析作用另外,JAVA并不比C语言慢,说JAVA慢一般是九十年代那时候的JAVA, 而现在 在 ...
- TCP、三次握手、四次挥手(图解)
传输控制协议(TCP,Transmission Control Protocol)是一种面向连接的.可靠的.基于字节流的传输层通信协议,为了在不可靠的互联网络上提供可靠的端到端字节流而专门设计的一个传 ...
- html+css第十篇-命名
命名:根据每块元素的主题 或者功能.在页面上的位置 php 每个单词中间以"_"隔开 #main_left_box{} 驼峰命名 从第二个单词开始每个单词的首字母大写 #mainL ...
- 程序员需要达到什么水平才能顺利拿到 20k 无压力?
程序员要拿到20k,应该达到什么水平? 1 熟悉增删改查技能,熟悉项目开发相关流程和技能. 2 能解决基本问题,分布式或比较深的问题,太难的不会不要紧,但常规的应该有项目经验. 3 简历好看些 ...
- 联盛德 HLK-W806 (四): 软件SPI和硬件SPI驱动ST7735液晶LCD
目录 联盛德 HLK-W806 (一): Ubuntu20.04下的开发环境配置, 编译和烧录说明 联盛德 HLK-W806 (二): Win10下的开发环境配置, 编译和烧录说明 联盛德 HLK-W ...