私のチームは ASP.NET Web アプリケーションを開発しており、いくつかの主要なブラウザー (IE、Chrome、Firefox) について、ブラウザーの種類とバージョン全体で一貫したルック アンド フィールを維持しようとしています。ユーザーが色やフォント サイズなどを選択できるように、可能であればテーマも許可したいと考えています。ただし、現在いくつかの CSS3 ルールが適用されているため、IE 8 および 9 との互換性を達成することに関して深刻な問題が発生しています。特に、これで使用されているシェーディング グラデーションdiv
は、IE 8 または 9 ではサポートされていないため、問題を引き起こしています。
#logos
{
width:1024px;
height:100px;
border-radius:15px;
color: -moz-linear-gradient(bottom, #297381, #FFFFFF);
color: -ms-linear-gradient(bottom, #297381, #FFFFFF);
color: -webkit-linear-gradient(bottom, #297381,#FFFFFF);
background:-moz-linear-gradient(bottom, #297381,#FFFFFF);
background:-ms-linear-gradient(bottom, #297381,#FFFFFF);
background:-webkit-linear-gradient(bottom, #297381,#FFFFFF);
}
これらのルールを追加することで、IE9でグラデーションを実現できると思います(間違っている場合は修正してください):
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#297381', EndColorStr='#FFFFFF')";
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=’#297381’, EndColorStr='#FFFFFF');
しかし、IE8 には対応するオプションはないと思いますし、どちらもサポートしているとは思いませんborder-radius
。その背景に静的な画像を利用する別のテーマまたはルールを用意したいと思っていましたdiv
。css でブラウザーのバージョンを検出し、正しいルールまたはテーマを適用する方法はありますか? それとも、コード ビハインドでこれを行い、そこからテーマを適切に設定する必要がありますか?