在CSS中,您可以使用裁剪(crop)功能來去掉圖片的一角,這個(gè)功能的語法如下:
img { width: 200px; height: 200px; object-fit: cover; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
在這個(gè)例子中,圖片會被裁剪成一個(gè)不規(guī)則形狀,只保留右下角的一部分。object-fit: cover;
確保圖片始終覆蓋其容器,而clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
則定義了裁剪的形狀。
如果您想要去掉的是其他角落,可以調(diào)整clip-path
的值,如果您想要去掉左上角,可以使用clip-path: polygon(50% 0, 100% 0, 100% 50%, 50% 50%, 0 50%, 0 100%);
。
這種方法可能在一些舊的瀏覽器上無法正常工作,因?yàn)樗褂昧薈SS的新特性,在使用之前,***好先測試一下您的目標(biāo)瀏覽器是否支持這些特性。