2011-09-10 17 views
0
<!DOCTYPE HTML> 

ボーダー半径はオペラに

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>opera border radius</title> 

    <style type="text/css"> 
     img{ 
      border-radius:10px; 
      -o-border-radius:10px; 
     } 
    </style> 

</head> 

<body> 
    <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/af/Bonsai_IMG_6426.jpg/450px-Bonsai_IMG_6426.jpg" width="337" height="450" alt="my think"> 
</body> 

答えて

2

Operaは直接画像にボーダー半径を追加する好きではない - Operaはそのような頑固です。 Operaで機能するソリューションについては

は、またhttp://www.komodomedia.com/blog/2010/10/border-radius-rounded-images-and-avatars/

をチェックアウトし、後ベンダー接頭辞ルール-o-border-radiusを実際のCSSルールborder-radiusを置きます。

+0

しかし、私のために働いていない私を助けてください。 –

+0

@vipulは 'copy/paste'と同じくらい簡単ですhttp://jsbin.com/exexer – balexandre

+0

@vipulはコピー/ペーストと同じくらい簡単ですjsbin.com/exexer - これは正解です。ありがとう! –

0

をサポートしていませボーダー半径はかなりの時間以来、オペラに問題があったhttp://dev.opera.com/articles/view/css3-border-background-boxshadow/#border-radius

を見てみましょう。最新バージョンでは、 がサポートされている場合、border-radiusプロパティを直接使用することができます。

正式には、Border radiusプロパティは、すべてのOperaバージョン> 10.5でサポートされていますが、Opera Miniではなく、Opera Mobile < 11ではサポートされていますが、問題があるようです。

(また、CSS3の下でこの質問をタグ)

[EDIT] 私は再びあなたのコードをチェックします。ボーダー半径を画像に適用したかったのです。あなたがフォアグラウンドの代わりにcssを使って背景イメージとして置かない限り、これはOperaでは不可能です。

これを行うには、divを作成し、imgではなくdivに丸い角を適用します。 背景画像を画像として設定すると、角が丸くなります。画像が中央に来ない場合は、位置プロパティを変更してください。それはトリックを行う必要があります。ここで

、これを試してみてください。http://jsfiddle.net/c8nmZ/5/

+0

私はオペラ11.51を使用しますが、ボーダー半径はサポートしていません。私のコードを試してみてください(ボーダー半径は画像のみをサポートしていません) –

関連する問題