请问图中红圈内的效果叫什么，怎么做出来的？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

Can I use?

http://caniuse.com/

Less

http://lesscss.org

Cool Libraries

Bootstrap from Twitter

Jetstrap

zippera

zippera 2013-06-23 15:03:08 +08:00 5587 次点击

这是一个创建于 4570 天前的主题，其中的信息可能已经有所发展或是发生改变。

我看源代码里面用的标签是 box 和 drop-shadow 。一般叫做什么？ css 怎么写？

源代码

图中红

shadow

13 条回复 1970-01-01 08:00:00 +08:00

yescola

2013-06-23 15:04:41 +08:00

一个白色块和底部的图片叠加的吧。。。或者是白色块，在块的下面放个那样的图片。
标签是啥无所谓了，爱怎么取怎么取。

qiayue

PRO

2013-06-23 15:10:07 +08:00

阴影

yescola

2013-06-23 15:18:03 +08:00

@qiayue 言简意赅。。。

zippera

2013-06-23 17:26:57 +08:00

@qiayue 能否介绍下怎么用？

tension

2013-06-23 17:30:43 +08:00

你再那里看到的用firebug 去看一下就晓得怎么用啦!!!

alay9999

2013-06-23 17:31:57 +08:00

两个一样大的矩形
上白下黑
黑色的变形
黑色的模糊
黑色的透明度

这是PS流程

CSS的话，我猜想是两个黑色阴影需旋转一定角度放在底下吧

chairuosen

2013-06-23 17:40:57 +08:00

-webkit-transform: rotate(-2deg);

zippera

2013-06-23 18:35:20 +08:00

@tension 谢谢，我用chrome的「审查元素」搞清楚了。

zippera

2013-06-23 18:37:17 +08:00

@chairuosen 感谢，正解。这是我刚总结的：http://zipperary.com/2013/06/23/box-and-shadow-effect/

yangg

2013-06-23 22:00:16 +08:00

good, 学习

Keinez

2013-06-23 23:31:27 +08:00 via Android

敢情CSS3也能做这样的效果了，顿觉落伍…

railgun

2013-06-24 10:39:06 +08:00

这叫阴影，英文叫shadow

loading

2013-09-08 08:33:53 +08:00

mark.