1

質問のために一番下までスキップしますが、最初に、少しコンテキストを説明します。

だから私はしばらくの間、CSS コンパイラ (Sass や Less など) を調べていて、それらに本当に興味を持っていました。彼らは粗雑さを減らし、私が物事をより簡単に見るのを助けます.

私は最近、多くの無関係なコードとハックを必要とするインライン ブロック (および clearfix) を確実に実装することを検討しています。現在、この分野のすべての権威によると、IE ハックを CSS と同じページに配置するべきではなく、条件付きにする必要があります。しかし、私にとって、このすべての追加コードを調べて管理するのは非常に面倒です。そのため、Less のようなものが本当に好きです。非セマンティックなクラスを適用する代わりに、ミックスインを指定して一度適用するだけで準備完了です。

それで、私はトラックの一部を手に入れたと思います (ポイントを説明したかったのです) が、基本的に、これらの CSS コンパイラーが私にとって非常に便利であり、多くの厄介なことを抽象化することができます。それらを確実に一度適用してから、コンパイルするだけです。IE 固有のスタイルを独自の条件付きファイル (ala Less / Sass) にコンパイルできるようにしたいので、理由もなく 2 つのファイルを管理する必要はありません。

独自のファイルを実行してアンダースコア/スターハックを作成できるスクリプト/アプリケーションのようなものは存在しますか?

4

3 に答える 3

9

これは実際にはコンパイラのトリックではありませんが、ブラウザーごとに個別のスタイルシートをコンパイルせずに条件付きコメントを使用したい場合は、単純に HTML 条件付きコメントを使用してスタイリング フックを挿入できます。例えば：

    ...
</head>
<!--[if lte IE 6]><body class="ie6 ie7"><![endif]-->
<!--[if lte IE 7]><body class="ie7"><![endif]-->
<!--[if gte IE 8]><!--><body><!--<![endif]-->

これで、残りのルールと同じスタイルシートで IE<=6 および IE<=7 に適用するルールをターゲットにすることができます。

body.ie6 #thing { position: relative; }
body.ie7 #otherthing { z-index: 0; }

* htmlこれは、最後の受け入れ可能な CSS ハックであるハックよりもわずかにクリーンな IMOです。(「スター ハック」と「アンダースコア ハック」は無効な CSS です: 避けてください。)

于 2010-04-30T19:16:22.730 に答える
1

IE6/7/whathaveyou 用に生成された CSS シートを条件付きで含めることができます。

<head>
    <link rel="stylesheet" href="/css/master.css" type="text/css"/>
    <!--[if IE 6]>
      <link rel="stylesheet" href="/css/ie6.css" type="text/css"/>
    <![endif]-->
</head>

また、IE の修正/ハックを SASS/CSS の大部分と混合することが心配な場合は、それらを独自のパーシャルに分割できます。

@import ie6.sass

上記には、現在の SASS ドキュメント内の特定のバージョンの IE のすべてのルールが含まれます。パーシャルに関するドキュメントは、ここにあります: SASS パーシャル

于 2010-04-30T19:22:17.913 に答える
0

これは、最後の受け入れ可能な CSS ハックである * html ハックよりもわずかにクリーンです。(「スター ハック」と「アンダースコア ハック」は無効な CSS です: 避けてください。)

そうではありません: 「アンダースコア ハック」は無効ですが、「* html」および「*+html」ハックは完全に有効な CSS です。自分で調べてください。;)

〜

上記の質問に関しては、今のところ、それを実行できるコンパイラを認識していませんが、それでもスタート ハック (IE6-7) を使用して、すべてを 1 つのファイルに保存することを好みます。より保守可能。

于 2010-09-23T15:16:30.460 に答える