相信绝对多数人在开发比较大点的网站建设CASE时都会遇到过一种常见的形式,比如说商品图片上加上一个小图标显示促销,显示折扣,显示买就送等等!
这种情况,很多人第一个思路是把商品图片当背景,然后把一个透明的小图标放在商品的上方,第二种方法有人甚至想到用加水印的方法一样加到图片的上方!先分析下这二种方法的实际操作可性行,第一种,我们在DIV+CSS中写程序代码的可行性基本上不现实,另外就是一个透明图标放图片也是一个问题。第二种方法从理论角度是可行的,但问题是相对来说运行效率低下,另外一个方面,如果客户想后台取消促销或折扣等字样时,此图片已被打上了“烙印”,难道要客户重新上传图片吗?从这几个方面的分析可见上面的二种方法最起码是存在很大缺限的!
既然我们看上面二种方法不可行,那我们在网站建设中如何去不让图片被加个附加物也能让程序轻松实现,程序以前是什么样还是什么样,其实我们只要灵活就用CSS中的相对定位与绝对定位的原理就可以很容易解决此问题:实现方法:在定位商品时CSS可以这样写:{position:relative;width:163px;height:158px;float:left;text-align:center;padding-top:7px;padding-left:2px;text-align:center;}在显示图标定位时可以这样写CSS:{top:0px;left:0px;position:absolute;}
在网站建设中也许有很多种方法可以解决同一个问题,找到最便捷,最行之有效的方法才是我们处理问题的根本!
本文地址:http://www.eobo.cn/news/379.html
|