2

次のCSSセレクターがあります

 body
 {
   margin: 0;
   font-family: "Arial" ;
   font-size: 18px;
   line-height: 25px;

  }

line-heightブラウザがIEなら10pxに変更する条件を書きたい

ここで同様の質問を1つ検索しましたが、質問に記載されているような条件を追加すると、構文エラーがスローされますMissing property name before colon(:)。私は質問に従い、次のようなコードを修正しました

    .bodyClass
    {
      margin: 0;
     font-family: "Arial";
     font-size: 18px;
     line-height: 25px;

     <!--[if IE 6]>
       line-height: 10px;     
     <![endif]-->

   }

cssセレクター内に条件ステートメントを記述する方法は? IE とその他のブラウザ用に異なるスタイル シートを作成したくない

4

5 に答える 5

7

個別のスタイルシートを作成したくない場合は、2 つの選択肢があります。

IE 条件付きコメント

条件付きコメントを使用して、<html>タグにクラスを指定します。次に例を示します。

<!--[if lt IE 7]>  <html class="ie ie6 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 7]>     <html class="ie ie7 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 8]>     <html class="ie ie8 lte9 lte8"> <![endif]-->
<!--[if IE 9]>     <html class="ie ie9 lte9"> <![endif]-->
<!--[if gt IE 9]>  <html> <![endif]-->
<!--[if !IE]><!--> <html> <!--<![endif]-->

このようにして、CSS で次のような優れた自己記述型セレクターを使用できます。

html.ie6 .bodyClass { line-height: 10px}

CSSハック

別のオプションは、適切なCSS ハックを使用して、関心のあるブラウザーをターゲットにすることです。このアプローチの利点は、HTML/DOM にまったく触れずに実行できることです。構文的に有効な CSS でありながら、IE 6 のみを対象とする特定のハックは次のとおりです。

.bodyClass { _line-height: 10px; /* hack targeting IE 6 only */ }

CSS ハックを使用することに決めた場合は、将来のメンテナーを支援するために何をするかを説明するコメントを必ず添付してください。

于 2013-10-10T09:31:53.800 に答える
0

試す<!--[if lte IE 6]>

または、反対のことを試して、行の高さを 10 として追加してから使用することもできます

<!--[if !IE]>--> do something; IE will ignore this, other browsers parse it <!--<![endif]-->

他のブラウザの行の高さを設定します。

以下は CSS による IE のサポートへのリンクです。

http://dev.opera.com/articles/view/supporting-ie-with-conditional-comments/

もう 1 つの便利なサイトはhttp://css3please.com/で、 IE、Chrome、およびFirefoxのさまざまな CSS が示されています。また、サイトをリアルタイムで編集することもできます。

于 2013-10-10T09:41:11.127 に答える