这是一个创建于 4007 天前的主题，其中的信息可能已经有所发展或是发生改变。
在客户在做企业站，客户要求实现类似如图的效果。
但是我发现图片中的那些图标，思维导图都不是不是图片的格式。
我右键去点击没有“下载图片选项”。
另外我把整个网页下载下来，图片包里也没有该张图片。
请问如何实现类似效果？？
图片如下：
网页原地址：
http://www.asiaqualityfocus.com/about-aqf
http://www.asiaqualityfocus.com/inspection-services
但是我发现图片中的那些图标，思维导图都不是不是图片的格式。
我右键去点击没有“下载图片选项”。
另外我把整个网页下载下来，图片包里也没有该张图片。
请问如何实现类似效果？？
图片如下：
网页原地址：
http://www.asiaqualityfocus.com/about-aqf
http://www.asiaqualityfocus.com/inspection-services
 |
1
raincious 2013-12-05 12:03:45 +08:00  1
Icon最简单的应该是字体。圆角可以border-radius，尖角可以width:0px; height:0px; border: 0; border-left: 50px solid #eee;
楼主换上IE6就知道哪些是图片，那些是CSS布局了。 |
|
2
raincious 2013-12-05 12:05:11 +08:00
哦我错了，尖角可以width:0px; height:0px; border: 50px solid #fff; border-left: 50px solid #eee;。但是上面的尖角是不规则的（不是45度），这个我真不知道怎么做到。
|
 |
3
qqwerr 2013-12-05 12:05:55 +08:00
用chrome右键一下不就出来了嘛。。
background-position: -5px -1654px; background-image: url("/images/front/sprite-front.png"); background-repeat: no-repeat; 所以还是图片： http://www.asiaqualityfocus.com/images/front/sprite-front.png |
 |
4
haker 2013-12-05 12:09:28 +08:00
楼上正解
|
|
5
haker 2013-12-05 12:10:52 +08:00
|
 |
6
lizheming 2013-12-05 12:40:46 +08:00
ls两个正解..另外吐槽一下，谁说背景图右键的话会出现保存选项的...
|
 |
8
Seita 2013-12-05 12:43:04 +08:00
楼上全部正解。
|
 |
10
chairuosen 2013-12-05 14:05:00 +08:00
不用图的话，可以用svg
|
 |
11
66beta 2013-12-05 14:07:19 +08:00
两个都是背景图，最原始的CSS
|
 |
12
linfox OP 谢谢楼上的热心V友。原来是背景图。谢谢大家哦！
|
 |
13
zakokun 2013-12-05 15:44:21 +08:00
你搞前端不用fireBug 吗？用fireBug看看马上就发现了
|
 |
14
LcaKen0day 2013-12-06 15:08:37 +08:00
chrome F12
|
Select Language