使用img标签做div的背景图片

0 使用img标签做div的背景图片

一般来讲，制作网页模板的时候，习惯用css里面的background来定义div元素的背景。这是最通用最便捷的方法，并且将ccs代码写到css样式表的单独文件里，还可以简化html代码，使网页代码更加简洁。

img图片标签用作div背景图.jpg

但是，有些时候会有一些图书需求。比如当元素的背景图片需要变动的图片的时候（非gif动图），就是说这个背景图片是随着内容而变化的而非一张固定的图片。css文件就没法实现或者很难实现了。当然，在html代码里插入style标签然后在标签里插入变量图片也是一个方法,但是这样做并不是最优解.

一方面，这种写法让页面代码显得相对混乱。另一方面，对于SEO而言并不那么友好，因为搜索引擎优化中一般的定义是，搜索引擎的植株是不读取css内容的，所以若果把div背景变成一个img标签，就可以完美的实现这个需求。简化了代码的同时，还帮助了SEO的工作。

使用img标签做div的背景图片实例：




 



	
		
		
			这是一段编辑好的文字用来展示一下背景图片的效果

			我是第二行

			这里成功实现了用img标签做div背景图片

这是个基础例子，具体需要的样式自己配合自己的css做出修改即可。

赞(0)
打赏 微信扫一扫微信 支付宝 QQ 扫码打赏
如若转载，请注明本文出自：https://www.guaitoo.com/show/131.html

热门资讯

最新文章

版权所有 © 2022 乖兔