如何在CSS中使边缘变圆？

Question

我是网页设计的初学者,所以我有一个相当业余的问题要问.我创建了一个文本框,但我不知道如何使边缘圆形而不是矩形.我知道CSS在矩形边框上起作用.如果可能的话,我还想在盒子下面添加一个小阴影,我不知道如何实现它.这是我专门针对盒子部分的代码:

#wrapper{
border: solid 1px #eeeeee;
}

"#wrapper"是指另一个文档中的一段php代码.谢谢.

Answer 1

使用border-radius和box-shadow.

#wrapper {
    border: solid 1px #eee;
    border-radius:10px; /* round corners */
    box-shadow:0px 3px 5px 5px #000; /* add shadow */
}

以下是每个参数......

border-radius:(radius of border corners)
box-shadow:(horizontal offset) (vertical offset) (blur) (spread) (color)

您可能希望为CSS3属性添加前缀-webkit,-moz以增加与旧浏览器的兼容性.