html - 我可以在伪选择器图像之前或之后放置边框半径吗？

Question

当我将图像 url() 放入 content:'' 属性时，有什么方法可以在 :before 或 :after 上获得边框半径？

Answer 1

是的，你可以在伪元素 ::after, ::before 中使用 border-radius 和背景图片:

div:before {
  content: "";
  display: block;
  width: 200px;
  height: 100px;
  background-image: url(http://placehold.it/200x100);
  border-radius: 10px;
}

<div></div>