境界線付きのCSS丸められたコーナー

Question

私は、ナビゲーションエレメントに丸い角を適用するためにCSSを使用します。この要素には境界線もあります。

だから、これはどのように見えるかです：あなたが丸みを帯びた角の品質を見ることができると同様

- ボーダーの組み合わせが奇妙で、通過輝く白のビットがあります。

これを修正する方法はありますか？ bg-imagesを使用する必要がありますか？

Answer 1

残念ながら、はい、背景画像を使用する必要があります。 border-radiusで実際の枠線を正しく処理しないブラウザがあります。 Firefox上でStack Overflowのバッジスタイル（これもborder-radiusを使用しています）に起こっていることがわかります。 border-radiusの問題を修正するために何かできることは、それぞれのベンダーにバグを報告する以外にはないと思います。

Answer 2

はい、このjqueryプラグインを使用して行うことができます。 http://jquery.malsup.com/corner/

コーナーイメージはありません。ネストされたdivを使用して枠線を描画します。柔軟で使いやすいです。また、ネイティブborder-radiusのサポートが追加されているため、border-radiusをサポートしていないブラウザでのみ実行されます。