clip-path是一個(gè)css3新屬性 , 使用于SVG或形狀定義一個(gè)HTML元素的可見區(qū)域的方法。
4個(gè)基本語法
:inset(定義矩形)可以5個(gè)參數(shù),分別對(duì)應(yīng)上,右,下,左的裁剪位置,round radius(可選,圓角)
:circle(定義圓)可以傳2個(gè)可選參數(shù);
1. 圓的半徑,默認(rèn)元素寬高中短的那個(gè)為直徑,支持百分比
2. 圓心位置,默認(rèn)為元素中心點(diǎn)
:ellipse(定義橢圓)可以傳3個(gè)可選參數(shù);
1. 橢圓的X軸半徑,默認(rèn)是寬度的一半,支持百分比
2. 橢圓的Y軸半徑,默認(rèn)是高度的一半,支持百分比
3. 橢圓中心位置,默認(rèn)是元素的中心點(diǎn)
:polygon(定義多邊形)填充規(guī)則用來確定該多邊形的內(nèi)部。
兼容不是很好慎用!
