組み合わせのスタイル

StackOverflow https://stackoverflow.com/questions/1112601

  •  12-09-2019
  •  | 
  •  

質問

していると感じていたできますスタイルのクラス内です。例えば、

med-font {
  font-size:12px;
}

#message a {
  style: med-font;
  color: blue;
  ...
}

/* lots of other styles, some of which use med-font */

これは明らかでつなぎの例ですが、ステークホルダーのすべてのアンカータグ内で#メッセージな必要性の明示的クラスまたはidを持っています。今のいずれかの複製フォントサイズ各クラスが必要なので追加の授業んその他必要とします。とを入れたいので簡単に制御するフォントサイズから、または、追加ます。

少し値段が高くなりますが、分割を定義の"#メッセージに"この例を表示します。この作品ok小型、大型の案件はもともとは私の少なくとも好まれます。このサイトの維持が難しい多くのクラスが割れや点在する大スタイルのファイルです。

med-font, #message a {
  font-size:12px;
}

#message a {
  color: blue;
  ...
}

その後、私の質問は二つのパーツ：1.この方の迷惑に?2.なんだろうけど、日本人の場合この機能ははたられていることCSS3?

編集： 加えばhtmlのbodyます。

の主な点は追加クラス属性は、20点以下の設定フォントサイズは面倒なのです。

<div id="username" class="med-font">schickb</div>
<div id="message">
  <div id="part1">
    <a href="whatever">text</a>
    <!--lots more tags and say 6 anchors -->
  </div>
  <div id="part2">
    <a href="foo">text</a>
    <!--lots more tags and say 8 anchors -->
  </div>
</div>
<div id="footer"> <!-- footer anchors should be a smaller font-size -->
    <a href="boo">lala</a> 
    <p class="med-font">Company Name</p>
    <!-- other tags and 3 more anchors -->
</div>

この重要な目標は一つの場所"med-フォント"が宣言されていることが任意に調整可能です。実際にプロジェクトがあり、小型-中型-大型フォントメーカーです。いい宣言でないのを検索するcss言の変更12pxに11px.

最良の解決策は、現在、追加の"med-フォント"クラスのすべてのアンカーの身体の"小フォント"クラスのすべてのアンカー、フッター.がなかったものだけに選択されたフォントのスタイルの"#メッセージの"および"#footer。

概要： たいCSSり ドライ

役に立ちましたか？

解決

これはまさに、 コンパス の枠組みをいいます。Sassできる変数は、コーディングスタイルシートを維持する速くて使いやすい、気持ちがいい経験でした。

他のヒント

手に入れたわけではありませんの迷惑いを利用できるので、複数のクラスのための要素があり、いずれのマッチ：

.idiot {
   color:pink;
   text-decoration:underline;
}

.annoying {
   font-weight:bold;
}

/* and if you want to get REALLY specific... */
.annoying.idiot {
   background-image('ann.jpg');
}
...

<div class="annoying idiot">
   Ann Coulter
</div>

個人的に、私はそれより汎用性をどのように解消するか、また例えば、マウスでクリック（または他のframeworkを追加したり削除することができこれらのクラス--最も一般的に、追加"を選択した"クラスまたは何かというようなものを選んでテーブルセルや人がクリックで切り替えで、すぐに削除する"選択されている"クラスです。ブで優雅なと思う。

を編集 全ていいのCSSからのリンクだというようになります:

#message > div > a {
   font-size:12px;
}

#footer > a {
    font-size:10px;
}

の>シンボルの意味は"あの子"

より一般的には(これにもマッチする直接内#メッセージもより深いのスペースの手段"はその子孫の")

#message a {
   font-size:12px;
}

#footer a {
    font-size:10px;
}

していSASSがないと考えている。することができ入れ子のCSS構造を変換する。ると思います。

私の意見ることができるというのもないことはOKでCSS引き続きそうあるべきであるとしてstraightfowardとが可能です。の最大のメリットでCSSともにMicheal景のXSLT参考えxstl...しかし、CSSは非常にシンプルかつ非常にわかりやすい。

いて複数の場所をお知りになスタイリングの効果をクラスタ(もんだ).

いいんじゃないかとのできないために番号1です。および(2)に関しては、論議の的でしたが、昨今のとならないと思いますの一部を標準とする。

cssがない、プログラミング言語はありませんでしたが意味することができます(こと)なります。いう議論においてたっぷりの時にW3CとWHATWG

ちなみに回答1)なの迷惑い

  1. まだ迷惑っIE6ニ僕:)

  2. この外での使用も可能です。ては、特にcssの枠組みはしないよう奨励されている一括すべてのcssファイルに現在のための"最適化".I havent聞いた話などの特徴css3が、まだまだ道のりが仕様なので、知り尽くしたので、可能なものである場合は十分なノイズ！

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top