4

だから私はこれについて熟考してきましたが、これは存在しないと思います。また、私のロジックがスタイルシートが対応しようとしているものに反していることも理解していますが、試してみましょう:

次の例を見てください。

 // Example "template style"
 .blue_bold {
      color: blue;
      font-weight: bold;
      /* other styles can go here */
 }

それで、それをフッターに追加したいとしましょう:

 <div class="blue_bold" id="footer">
      // Content goes here
 </div>

これは完璧ですが、その要素をいくつかの要素に追加したい場合はどうすればよいでしょうか。ナビゲーションにも追加したい場合は、そのクラスを各要素に追加する必要があります。

 <div class="blue_bold" id="navigation">
      // Content
 </div>
 ....
 <div class="blue_bold" id="footer">
      // Content
 </div>

私の質問は、クラスまたはスタイルを介して宣言するのと同じように、スタイルをスタイルシート内の別のスタイルに「アタッチ」する方法はありませんか? (例:)

 #navigation, #footer  {
      attach_style(".blue_bold");
 }

そうすれば、「基本スタイル」を作成してコードを最小限に抑え、それらのスタイルをスタイルシート内の個々のスタイルに添付できますか? これも単なる質問であり、私が提案したいことではありませんが、上記のことを考えると、たとえばブランドのガイドライン文書を扱っていて、特定のスタイルを個々のスタイルに添付したい人にとっては「あるといい」と思いますそれを行うためのhtml。

何か案は？これは存在しますか？

4

4 に答える 4

3

純粋なCSSではできません。CSS を生成するには、 LESSまたはSASS/SCSSを使用する必要があります。

構文例はこちら:

以下

.blue_bold {
    color: blue;
    font-weight: bold;
}
#navigation, 
#footer {
    .blue_bold;
}

SCSS

.blue_bold {
    color: blue;
    font-weight: bold;
}
#navigation, 
#footer {
    @extend .blue_bold;
}
于 2013-02-13T11:00:02.297 に答える
0

sass またはそれ以下を確認する必要があります。これが最良の選択肢です。

ここでサス

ここでは少ない

于 2013-02-13T11:00:04.607 に答える
0

sass または less を使用できますが、より基本的なわずかな回避策は、css の要素を次のようにリストすることです。

#navigation,
#footer,
.some-other-element,
.another-element
{
      // css styles go here that you want to apply to each element listed above
}
于 2013-02-13T11:02:02.717 に答える
-4

メリットが見当たりません。あなたが求めているのは、標準の CSS ではありません。クラスを持つすべての要素に対してこれを定義できますblue_bold

.blue_bold {
     color: blue;
     font-weight: bold;
     /* other styles can go here */
}

このブロックの場合

<div class="blue_bold" id="navigation"></div>

次のような別の宣言を追加するだけです。

#navigation, #footer {
     background: black;
     color: red;
}

上書きされない限り、.blue_bold からすべてが使用されます。それの何が問題なのですか？

于 2013-02-13T11:02:16.083 に答える