CSS: What's a good way to create a raised box effect?

前端 未结 5 1247
你的背包
你的背包 2020-12-30 08:43

That is, the left and bottom borders of the element need to give a 3d effect of it popping out. Is there a good, purely-CSS way to accomplish this effect?

5条回答
  •  无人及你
    2020-12-30 09:12

    #foo {
        /* ... */
        border:8px outset #999;
        -webkit-box-shadow: 5px 5px 15px rgba(0,0,0,0.4);
        -moz-box-shadow: 5px 5px 15px rgba(0,0,0,0.4);
    }
    

    Here's the example live: http://jsfiddle.net/sjkXS/1/
    Yes, the effect here is cheesily-extreme, indended to showcase what is possible.

提交回复
热议问题