如何仅将边框半径应用于面部？

Question

你好，我有一些图像需要应用边框半径（将图像制作成圆圈），但我只想做脸部。那么如何将边框半径仅应用于脸部或仅应用于图像的顶部？客户不希望展示太多 body。

之前

之后

Answer 1

您最好的选择是在您喜欢的照片编辑器中裁剪照片。

如果你必须用代码来做，你需要改变图像在容器中的位置，或者简单地把它用作 background-image 并改变它的 background-position:

.img {
  width: 300px;
  height: 300px;
  background-image: url(https://i.stack.imgur.com/tiCHu.png);
  background-position: center top;
  border-radius: 50%;
  
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2)
}

<div class="img"></div>

如何仅将边框半径应用于面部？

how to apply border radius to the face only?

html

css

border-radius