0

div のみを使用してカスタムメイドの角丸ブロックを作成することを考えています。それが十分なアプローチであるかどうか、またはクロスブラウザーサポートを取得する簡単な方法があるかどうか、皆さんの考えを知りたいと思っていました (サポートしている間) IE6 などの古いブラウザ)

皆さんが簡単に理解できるように、少し簡単な説明コードを書きます。

<div class="Block" style="position:relative">
    <div>
    Content will go here or something
    </div>
    <div name="TopLeft" style="position:absolute;top:0;left:0;"></div>
    <div name="TopRight" style="position:absolute;top:0;right:0;"></div>
    <div name="BottomLeft" style="position:absolute;bottom:0;left:0;"></div>
    <div name="BottomRight" style="position:absolute;bottom:0;right:0;"></div>
</div>

実際のコードでは、それぞれに背景を与えます。もちろん、そのようにインラインで記述するのではなく、css ファイルに入れます。

4

5 に答える 5

2

CSS3Pieを使用します。

border-radiusこれは、古いバージョンの IE で CSSを実装する IE 用の Javascript ハックです。

于 2012-08-27T13:50:14.660 に答える
1

IE6-9ブラウザで丸みを帯びた角が必要な場合は、CSS3border-radiusと1つのPIE.htcファイルのみを使用する必要があります

プログレッシブInternetExplorer

div{ border-radius: 6px; -moz-border-radius: 6px; behavior: url(PIE.htc); }

これは、すべてのIEブラウザーで最適に機能します

于 2012-08-27T13:49:26.487 に答える
1

Yes, that will work fine.

You can also add the elements using script, that will make the markup cleaner. I use that approach here: bytbil.com

于 2012-08-27T13:52:39.167 に答える
0

私はこれがうまくいくと思います、そしてそれはIE6をサポートするために何よりも良いです。

IE6をカバーするソリューションは、ひどいハックになるはずです。あなたが本当にそれを必要としているかどうか疑問に思うことは本当に価値があると思います。私は、cssの丸みを帯びた角を使用して、チップを適切な場所に落下させることを好みます。

于 2012-08-27T13:55:19.207 に答える
0

間違いなくIE6で動作しますが、次のものを使用できます。

-moz-border-radius: 15px;
border-radius: 15px;

それをDIVのCSSに入れると、ほとんどのブラウザーがサポートされますが、IE6についてはよくわかりません... IE9、Safari（5+）、FireFox（1.0+）、Chrome（5+）、およびOpera（10.5+）..。

于 2012-08-27T13:48:29.253 に答える