和小胖儿一起向<img>说再见.

本文讨论了在特定场景下,如何使用CSS的background-image属性来替代HTML中的&lt;img&gt;标签,以实现更好的页面解耦及维护性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

废话不说,直入主题.
我的观点很简单, 当你使用<img>标签时,如果满足以下条件,那么请你不要再使用它了:
1 图片内容或路径不是动态生成的.
2 图片的作用类似图标,给用户操作提示
3 图片的作用只是起到装饰作用(做页面修饰)

不用IMG 那么用什么呢?
用span 或 div + CSS (background-image),然后把css全部提取到css文件中.

为什么这么做呢?

答案很简单,让你的jsp页面,jspTag(如果你的tag代码中输出<img>的话)和图片资源彻底的解藕.
最终目的是要达到: 图片的路径的变化,只会引起css文件内容的变化.
而对jsp java jsptag代码毫无影响.

CSS是用来决定页面的样式 和 美观与否的关键,
而图片从某种程度上来讲(尤其是满足文章开头所列三点的图片) 也决定着页面的样式 和 美观与否.
显然他们应当是一类.这也是为什么CSS文件中对URL的使用采用的是"相对与CSS文件"而不是"相对于引用CSS文件的文件"(很久以前是后者这样的).

总之,希望大家能够尽可能的用我说的方式,渐渐放弃对IMG的依赖.
如果你在做一个支持换肤的系统时,你就知道这有多重要了.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值