clip-path是乙個css3新屬性 , 一般用在svg元素上 , 但是也可以作為普通元素裁剪使用
解釋 : clip-path 屬性可以建立乙個只有元素的部分區域可以顯示的剪下區域。區域內的部分顯示，區域外的隱藏
普通標籤上的使用
.pc
.pc>img
.pc > img:hover
/* keyword values */clip-path: none;
/* values */
clip-path: url(resources.svg#c1);
/* values */
clip-path: margin-box;
clip-path: border-box;
clip-path: padding-box;
clip-path: content-box;
clip-path: fill-box;
clip-path: stroke-box;
clip-path: view-box;
/* values */
clip-path: inset(100px 50px);
clip-path: circle(50px at 0 100px);
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
clip-path: path('m0.5,1 c0.5,1,0,0.7,0,0.3 a0.25,0.25,1,1,1,0.5,0.3 a0.25,0.25,1,1,1,1,0.3 c1,0.7,0.5,1,0.5,1 z');
/* box and shape values combined */
clip-path: padding-box circle(50px at 0 100px);
/* global values */
clip-path: inherit;
clip-path: initial;
clip-path: unset;
css
CSS中的路徑裁剪樣式clip path
clip path屬性可以防止部分元素通過定義的剪下區域來顯示，僅通過顯示的特殊區域。剪下區域是被url定義的路徑代替行內或者外部svg，或者定義路線的方法 注意 ie瀏覽器不支援，且低版本webkit核心瀏覽器需要新增 webkit 字首 clip path 值 none url inset ci...
CSS中的路徑裁剪樣式clip path
css借鑑了svg裁剪的概念，設定了clip path樣式，本文將詳細介紹路徑裁剪clip path clip path屬性可以防止部分元素通過定義的剪下區域來顯示，僅通過顯示的特殊區域。剪下區域是被url定義的路徑代替行內或者外部svg，或者定義路線的方法 注意 ie瀏覽器不支援，且低版本webk...
css3使用clip path裁剪元素
clip pathcss 屬性可以建立乙個只有元素的部分區域可以顯示的剪下區域。區域內的部分顯示，區域外的隱藏。剪下區域是被引用內嵌的url定義的路徑或者外部svg的路徑，或者作為乙個形狀。clip path屬性代替了現在已經棄用的剪下clip屬性。clip source basic shape g...