CSS可以通過clip-path屬性和mask屬性來設置不規則的圖片。
/*使用clip-path屬性*/ .clip { -webkit-clip-path:polygon(50% 0, 100% 50%, 50% 100%, 0 50%); clip-path:polygon(50% 0, 100% 50%, 50% 100%, 0 50%); } /*使用mask屬性*/ .mask { -webkit-mask-image:url('path/to/mask/image.png'); mask-image:url('path/to/mask/image.png'); }
clip-path屬性可以通過多個點來定義一個不規則的形狀,其中每個點代表一個角落。在上面的代碼中,我們使用polygon函數來定義一個四邊形形狀。當然,你可以使用其他函數,如circle、ellipse等。
mask屬性需要一個遮罩圖像來定義不規則形狀。在遮罩圖像中,白色表示將要顯示的區域,而黑色部分則是要隱藏的區域。你可以使用Adobe Photoshop或其他圖像編輯器來創建遮罩圖像。
上一篇css怎么設置圖片不變形
下一篇css怎么設置圖片的時間