如何使文本框有圆角？

Question

我有这个线框http://problemio.com/problemionewest.pdf，你在右上角看到有一个带圆角的文本框。

仅用css或image和css完成吗？我有一个提供给我的图像，但更愿意用css做。在任何情况下，我不知道如何做到这一点大声笑，所以任何帮助都会很棒！

我当前的版本是：http://www.problemio.com

Answer 1

你可以使用CSS来做到这一点，但在IE8中不支持它。您可以使用http://borderradius.com这样的网站来提供您使用的实际CSS，这看起来像这样（再次，取决于您尝试支持的浏览器数量）：

-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

Answer 2

这可以通过CSS3完成：

<input type="text" />

input
{
  -moz-border-radius: 15px;
 border-radius: 15px;
    border:solid 1px black;
    padding:5px;
}

http://jsfiddle.net/UbSkn/1/

---

但是，另一种方法是将input置于div内，背景为圆角，input

上没有边框