0

我得到了这个设计：

http://img526.imageshack.us/img526/1363/desginer.jpg

我正在尝试使用以下方法获得最佳结果：

        div.image {
            -moz-box-shadow: 0 0 1px 1px #bbb;
            -webkit-box-shadow: 0 0 1px 1px #bbb;
            box-shadow: 0 0 1px 1px #bbb;
            padding: 2px;
            width: 120px;
            height: 120px;
        }

<div class="image"><img width="120" height="120" src="image.jpg" title="title" alt="alt" /></div>

但是我尝试了很多值，但我仍然不确定什么是最好的。有小费吗？

4

4 回答 4

1

this does what you want; no 3rd value, a bit more on the 4th http://jsfiddle.net/jalbertbowdenii/LAT5B/

于 2012-05-21T23:00:32.267 回答
1

http://www.css3.info/preview/box-shadow/

From the page:

The Syntax:
box-shadow: none | < shadow > [ , < shadow > ]*
< shadow > = inset? && [ < length >{2,4} && < color >? ]

So, the first values can be the X(left) and Y(top) position, the third is the blur spred and the fouth is the color.

You can also specify inset at the start to create a inner shadow.

In your case, you will have to zero the top and left offset and define a blur radius accordingly:

div.image {
    ...
    -moz-box-shadow: 0 0 5px #bbb;
    -webkit-box-shadow: 0 0 5px #bbb;
    box-shadow: 0 0 5px #bbb;
}
于 2012-05-21T23:04:39.517 回答
1

For me, with that the perfect values : http://jsfiddle.net/D2LVq/1/

于 2012-05-21T23:04:43.450 回答
1

The closest I can get a shadow to your sample is this: 0 0 8px #666

于 2012-05-21T23:04:46.680 回答