html - 如何使用::after/::before 伪元素更改内容 url 图片的大小

Question

首先是我要更改的代码。

<style>
  h1::after {
    content: url(sig01.png);
  }
</style>

第二个是我尝试过的，但没有用。

<style>
    h1::after {
        content: url(sig01.png);
        display: inline-block;
        width: 200px;
        height: 200px;
    }
</style>

我做错了什么？

Answer 1

您无法调整内容图像的大小，但您可以使用 background-image 而不是 content 来变通。

<style>
h1::after {
  content: '';
  display: inline-block;
  width: 200px;
  height: 200px;
  background-image: url(sig01.png);
  background-size: 200px;
}
</style>