webkit 框圆角的困难
我正在尝试在我的 html 代码中实现一个框的圆角。 当我在 Chrome 上运行该文件时，我有框和所有属性，但角不会变圆。 我在 MAC OSX Lion 上使用 Komodo Edit。 解决办法是什么？ 感谢
<!doctype html>
<html lang="en">
<head>
<meta charset=="utf-8" />
<link rel="stylesheet" href="new.css" />
</head>
<body>
<div id="box">
<p id="text"> Hello </p>
</div>
</body>
</html>
CSS3：
body {
text-align:center;
}
#box {
display: block;
width: 500px;
margin:50px auto ;
padding:15px ;
text-align:center;
border: 1px solid blue;
background: red;
-webkit-border-radius: 25p;
}
#text {
font:bold 100px Century Gothic;
}
I am trying to implement a rounded corner to a box in my html code.
When I run the file on Chrome, I have the box and all the attribute but the corners won't round.
I am using Komodo Edit on MAC OSX Lion.
What's the solution?
Thanks
<!doctype html>
<html lang="en">
<head>
<meta charset=="utf-8" />
<link rel="stylesheet" href="new.css" />
</head>
<body>
<div id="box">
<p id="text"> Hello </p>
</div>
</body>
</html>
CSS3:
body {
text-align:center;
}
#box {
display: block;
width: 500px;
margin:50px auto ;
padding:15px ;
text-align:center;
border: 1px solid blue;
background: red;
-webkit-border-radius: 25p;
}
#text {
font:bold 100px Century Gothic;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
问题可能是它应该是 25px 而不是 25p。
但根据您的 Chrome 版本，您应该删除 -webkit- 并仅使用 border-radius ；
The problem is probably that it should be 25px instead of 25p.
But depending on you Chrome version, you should drop the -webkit- and just use border-radius;
您在那里不需要
-webkit-。只需使用边框半径即可。主要问题是您错过了
25px上的 x。You don't need
-webkit-on there. Just useborder-radius.The main problem is that you missed the x on
25px.看起来像是一个错字
，应该是
你最后漏掉了一个 x。为了跨浏览器合规性，您确实应该使用多个前缀。
Looks like a typo
Should be
You missed an x on the end. For cross browser compliancey, you should really use several prefixes.