Question

我试图通过使用CSS和.js脚本从这里使用CSS为我的ASP.NET网站上的按钮提供圆角效果。

http://www.monc.se/kitchen/59/scalable-css-buttons-using-png-and-background-colors

我只需要在课程中引用按钮。例如：

<head> 
    <link rel="stylesheet" type="text/css" href="css/btns.css" media="screen" />
    <link rel="alternate stylesheet" type="text/css" href="css/ie6.css" media="screen" title="ie6" />
     <script type="text/javascript" src="switch.js"></script>
</head>
    -----Body---
     <a href="" class="btn green">Test </a>

但是上面并没有给我圆角效果，因为它应用了CSS的绿色属性和悬停颜色，但我想要的主要是角落效果。我在这里缺少什么？

Answer 1

.rounded-corners {
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

这应该适用于大多数浏览器。

Answer 2

这是CSS3时间。试试这个：CSS Rounded Corners In All Browsers (With No Images)

Answer 3

确保您还使用/复制了图像http://www.monc.se/kitchen/stew/buttons/btn2.png。这个图像给出了圆角效果。

Answer 4

请注意，并非所有浏览器都支持圆角，因为它们相对较新。 Sam指出，有些浏览器一直在使用非标准的圆角项，直到border-radius的行为完全标准化为止。

这仍然是一种新技术，在所有用户使用支持它的浏览器之前还需要一段时间。

您使用的浏览器是什么？

圆角效果不显示

4 个答案: