htmlボタンのポータブルラウンドコーナー

私はdivにラップする簡単なhtmlボタンがあります。私は、そのようなボタンがブラウザによって異なってレンダリングされるかもしれないことを知っています。htmlボタンのポータブルラウンドコーナー

<div id="but_begin"><button type="button" id="but2_begin">Go</button></div>

私は（jQueryを使って）ボタンで次のCSSを設定している：

$("#but2_begin").css({ 
    backgroundColor: "yellow", 
    width:50 
});

と次のようにレンダリング：

enter image description here

私は取り除くしたいと思いますその周りの影とコーナーを丸くする。今、ボタンのレイアウトとコーナーの丸みについて、ネット上で利用できるすべての情報を読むと少し怖いです。それは全く収束していないようです。

私の質問：どのようにして、携帯用の方法でHTMLボタンの角を設定できますか？これはCSSでのみ可能ですか？または、ライブラリを使用する必要がありますか？または、別のHTMLタグまたはメソッドを使用する必要がありますか？

2012-03-19 JVerstry

具体的には、どのブラウザをサポートする必要がありますか？そしてビジネス上の理由がある。 IE6と7をサポートすることは、最近ほとんど意味をなさない。本当に持ち運びできるようにしたい場合は、画像を使用してください。 – mrtsherman

私はここの答えが好きです：http://stackoverflow.com/questions/1648870/what-rounded-corner-approach-should-i-take – j08691

"影"を削除するには、 "border：none;"あなたのボタンのCSSで。丸みを帯びたコーナーにはCCS3が必要なので、http://css3pie.comや画像の背景などを使用しない限り、 Turnip

丸みを帯びたコーナーやテキストシャドウを移植性の高い方法で生成するには、CSS3を使用する必要があります。 http://css3generator.com/はそうするのに役立つ素敵なツールです。

最新のバージョンのChrome、IE、Safari、Opera、Firefox（ユーザーの90％以上をカバーする）など、CSS3や主要なブラウザをサポートしているブラウザが増えています。

例えば、http://css3generator.com/のこのコードは、多数のブラウザで丸い枠線を確実に作成します。

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

2012-03-19 20:40:10 dangerChihuahua007

あなたが話している「影」は、ボタンの境界です。 border:none;と設定されています。丸みを帯びたコーナーでは、純粋なCSSで行うことができますが、それが正常である場合にのみ、古いブラウザでは丸められません。 CSS3をサポートしている新しいものだけがコーナーを丸めます。

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

2012-03-19 20:42:42

答えて