.image{ background-color: #fff; padding: 10px; } .image img{ vertical-align: middle; }
首先大家需要为图片所在的容器添加一个背景色,这里大家选择白色作为背景色。然后为了让图片更加美观,大家给容器添加一些内边距。接着大家需要让图片垂直居中,这里大家使用了vertical-align属性。
<div class="image"> <img src="your-image.jpg" alt="your image"> </div>
最后,大家将图片放入到容器中即可,注意把图片的宽高属性设置好,让它在容器中更加美观。
通过CSS3给图片加背景色,不仅可以让图片更具美感,同时也可以让它在网页中更加突出,为用户带来更好的体验。