0

クライアント用のテンプレートを購入しました。このテンプレートには、明らかにページ上のすべてのリンクの親 CSS スタイルがあります。(これは、この特定のスタイルの上の .css に関するコメントの内容です)

今、サイトの残りの部分とは異なる背景色であるフッターの近くの下部にセクションを作成したので、CSS をオーバーライドして、残りの部分をいじらずに独自のパラメーターを指定したいと考えています。灰色と白のマウスオーバーが見栄えが悪いため、このサイトはどうにかできますか？

4

5 に答える 5

2

そのセクションに ID 属性を与え、スタイルを定義するときにそれを使用します。だから何か...

HTML

<div id="my-section">
  your section is here
</div>

CSS

/* your section's styling is here */
#my-section {
  ...
}

#my-section .sub-parts {
  ...
}

#my-section a {
  ...
}
于 2013-04-09T21:20:19.860 に答える
1

新しいクラスを作成し、次のようにオーバーライドするプロパティに !important を指定するだけです。 

body a {font-size:10px;}/* template general style */

a.mydiv{font-size: 16px !important;}/* your style  */
于 2013-04-09T21:35:50.740 に答える
0

より一般的なスタイルをオーバーライドするには、より具体的なスタイルを作成する必要があります。CSS の特異性について詳しくは、CSSの特異性: 知っておくべきことをご覧ください。

于 2013-04-09T21:26:07.857 に答える
0

CSS

/* Provided in your template */
a {
  color: gray;
}

/* Added for footer */
#footer a {
  color: blue; /* Or what color you want. */
}

HTML

<!-- Some HTML provided in your template -->
<div id="footer">
   <!-- Your footer content -->
</div>
于 2013-04-09T21:21:02.380 に答える
0

これは次の方法で行います。

  1. 各アンカーへの ID の割り当て
  2. 各アンカーで使用するクラスの作成
  3. テンプレート内で色が割り当てられている場所を検索してデフォルトの色を変更する
  4. 親要素と指定子を使用して色付けします。

オプション 3 は最も単純ですが、色が同じではない状態になります。そして、よくあることですが、テンプレートに干渉したくないでしょう。邪魔にならないルートを選択する場合は、オプション 1、2、および 4 が最適です。

ただし、オプション 1は大きな文書の場合、さらに拡張すると非常に面倒になる可能性があります。オプション 2も同様です。ケースバイケースで入力する必要があるためです。ほとんどの場合、この手法は、通常いくつかの要素の色をオーバーライドする必要がある場合に使用されます。

ただし、多くのアンカーを使用していて、この色をそれらに適用する必要がある場合は、オプション 4 が色の割り当てとして最適であり、クラス指定または親要素の ID によって実行できます。これにより、大幅に簡素化されます。あなたの人生。

例：

HTML が次のようになっている場合:

<a href="http://www.google.com/">Google</a>
<a href="http://www.facebook.com/">Facebook</a>
<a class="mylink" href="http://www.stackoverflow.com/">StackOverflow</a>
<a id="link1" href="http://www.wikipedia.org/">Wikipedia</a>

<div id="colorize_by_id">
    <a href="http://www.reddit.com/">Reddit</a>
</div>

<div class="colorize">
    <a href="http://www.youtube.com/">YouTube</a>
</div>

CSS は次のような方法で定義されます。

/*This is an example of what the template does to each anchor tag*/
a {
    color: green;
}

/*However, by adding a class to the anchor, you can override the "default" color.*/
a.mylink {
    color: blue;
}

/*And, if you wished to use on a case by case basis, you can do it by applying it per id*/
a#link1 {
    color: red;
}

/*Change the color of the anchors on an id by id basis*/
div#colorize_by_id a {
    color: magenta;
}

/*Change the color of the anchors on a class basis*/
div.colorize a {
    color: yellow;
}

ご覧のとおり、実際の動作をご覧ください: http://jsfiddle.net/4TMpy/

于 2013-04-09T21:30:28.257 に答える