[分享]css不用背景图怎么显示图片

网页中经常需要显示图片，而一般情况下我们习惯使用CSS的backgroundimage属性来添加背景图片。但是，如果我们希望不使用背景图却能将图片显示在页面上，该怎么办呢？以下是两种方法： 1. 使用...

网页中经常需要显示图片，而一般情况下我们习惯使用CSS的background-image属性来添加背景图片。但是，如果我们希望不使用背景图却能将图片显示在页面上，该怎么办呢？以下是两种方法：

1. 使用img标签：

<img src="image.jpg" alt="图片"> 

这是最简单的方法。我们可以使用img标签来插入图片，通过src属性设置图片地址即可。需要注意的是，我们在使用img标签时应该添加alt属性，以便屏幕阅读器等辅助技术能够读取这个图片的描述文本，同时若图片无法加载时可以显示出来一个描述文字。

2. 使用CSS的content属性：

div {
  content: url("image.jpg");
} 

在CSS中，我们可以使用content属性为元素添加内容。这个属性经常与伪元素（如:before和:after）一起使用。content属性可以设置字符串、元素、计数器、属性值和图像等等。我们可以使用content: url("image.jpg")来将图片显示在页面上。与img标签不同的是，使用content属性无需在页面中插入HTML代码，而是直接将图片作为元素的内容插入其中。同时，图片的宽度和高度是根据元素的尺寸自动调整的。

通过以上两种方法，我们可以在不使用背景图的情况下显示图片。而对于这两种方法的选择，通常取决于具体的需求。