css - 如何为圆形图像创建透明内边框？

Question

我正在尝试为圆形图像创建透明内边框，使其看起来像下一张图像:

但我无法在 Chrome 中使用 CSS 完成此操作。我知道，在 Firefox 中可以使用 -moz-outline-radius 完成，但这在 Chrome 或其他浏览器中不可用。有人知道如何使用 CSS 创建此边框吗？

Answer 1

这就是您正在寻找的类型吗？

.bordered {
  background-image: url(https://www.koreaboo.com/wp-content/uploads/2017/08/20633602_495193994153039_1210028231588052992_n-2.jpg);
  width: 200px;
  height: 200px;
  border-radius: 200px;
  -webkit-box-shadow: inset 0px 0px 0px 19px rgba(255,255,255,0.75);
  -moz-box-shadow: inset 0px 0px 0px 19px rgba(255,255,255,0.75);
  box-shadow: inset 0px 0px 0px 19px rgba(255,255,255,0.75);
  background-size: cover;
}

<div class="bordered">

</div>