i am writing an application using html,css and javascript. i have set border radius of button to have rounded corner but which is not working in opera browser. but same i have tested in chrome it works. please do give some suggestion or help on this. here is demo
我正在用html、css和javascript编写一个应用程序。我将按钮的边框半径设置为圆角,但在opera浏览器中不能使用。但同样的,我在chrome上测试过它。请在这方面给予一些建议或帮助。这是演示
6 个解决方案
#1
3
Rounded Corner or all browser you want to use folloing method
圆角或所有浏览器都要使用折叠方法
#divId{
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-o-border-radius: 20px;
}
Its work for me perfectly.
这对我来说是完美的。
#2
1
Unfortunately the Border-radius css style is not fully cross-browser supported. Opera is one browser that does not offer support.
不幸的是,Border-radius css样式并不完全支持跨浏览器。Opera是一个不提供支持的浏览器。
See: http://www.westciv.com/iphonetests/
参见:http://www.westciv.com/iphonetests/
#3
1
First, did you try -o-border-radius
? Second did you try on a plain div? Sometimes form elements reject certain styles. Otherwise it isn't support (opera10 didn't have it).
首先,你试过-o-border-radius吗?第二,你试过普通的分区吗?有时表单元素拒绝某些样式。否则它就不支持(opera10没有)。
#4
0
Border radius in Opera with other demos related to Opera.
Opera的边界半径与其他与Opera相关的演示。
button {
background:#000;
color:#fff;
border-radius: 15px;
}
#5
0
In Opera you can use this:
在Opera中,你可以这样使用:
.className {
-o-border-radius: 3px;
}
#6
0
I ran into the same problem and found out that although border-radius is supported in Opera, it doesn't quite work with buttons.
But I managed to make it work, and achieved almost the same results. Here's my solution. Just recreate behavior of the button with following style:
我遇到了同样的问题,发现虽然Opera支持边界半径,但是它不能很好地使用按钮。但我设法使它发挥作用,并取得了几乎相同的结果。这是我的解决方案。只需按照以下样式重新创建按钮的行为:
button {
background-color: #ccc;
border-style: outset;
border-color: #eee;
border-radius: 6px;
}
button:hover, button:active, button:focus {
background-color: #ddd;
}
button:active { border-style: inset; }
The thing is, that border-radius works, when you change border-style property. The behavior of Firefox, for example, when you just use border-radius, looks like it's using border-style: outset for normal behavior of button, and border-style: inset, when the button is clicked.
There are only 2 extra lines to make it work in Opera almost the same way as in other browsers.
问题是,当你改变边界样式属性时,边界半径就会起作用。例如,当您使用border-radius时,Firefox的行为看起来就像是使用了border-style:在按钮的正常行为中使用的是start,在单击按钮时使用的是border-style: inset。只有额外的两行代码可以使它在Opera中的工作方式与其他浏览器几乎相同。
#1
3
Rounded Corner or all browser you want to use folloing method
圆角或所有浏览器都要使用折叠方法
#divId{
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-o-border-radius: 20px;
}
Its work for me perfectly.
这对我来说是完美的。
#2
1
Unfortunately the Border-radius css style is not fully cross-browser supported. Opera is one browser that does not offer support.
不幸的是,Border-radius css样式并不完全支持跨浏览器。Opera是一个不提供支持的浏览器。
See: http://www.westciv.com/iphonetests/
参见:http://www.westciv.com/iphonetests/
#3
1
First, did you try -o-border-radius
? Second did you try on a plain div? Sometimes form elements reject certain styles. Otherwise it isn't support (opera10 didn't have it).
首先,你试过-o-border-radius吗?第二,你试过普通的分区吗?有时表单元素拒绝某些样式。否则它就不支持(opera10没有)。
#4
0
Border radius in Opera with other demos related to Opera.
Opera的边界半径与其他与Opera相关的演示。
button {
background:#000;
color:#fff;
border-radius: 15px;
}
#5
0
In Opera you can use this:
在Opera中,你可以这样使用:
.className {
-o-border-radius: 3px;
}
#6
0
I ran into the same problem and found out that although border-radius is supported in Opera, it doesn't quite work with buttons.
But I managed to make it work, and achieved almost the same results. Here's my solution. Just recreate behavior of the button with following style:
我遇到了同样的问题,发现虽然Opera支持边界半径,但是它不能很好地使用按钮。但我设法使它发挥作用,并取得了几乎相同的结果。这是我的解决方案。只需按照以下样式重新创建按钮的行为:
button {
background-color: #ccc;
border-style: outset;
border-color: #eee;
border-radius: 6px;
}
button:hover, button:active, button:focus {
background-color: #ddd;
}
button:active { border-style: inset; }
The thing is, that border-radius works, when you change border-style property. The behavior of Firefox, for example, when you just use border-radius, looks like it's using border-style: outset for normal behavior of button, and border-style: inset, when the button is clicked.
There are only 2 extra lines to make it work in Opera almost the same way as in other browsers.
问题是,当你改变边界样式属性时,边界半径就会起作用。例如,当您使用border-radius时,Firefox的行为看起来就像是使用了border-style:在按钮的正常行为中使用的是start,在单击按钮时使用的是border-style: inset。只有额外的两行代码可以使它在Opera中的工作方式与其他浏览器几乎相同。