3

I have the following CSS that is being inherited (the original CSS):

h1 { 
    font-size:30px;
    line-height:36px;
}
h1 small {
    font-size:18px;
}

I have a class whereby i want to override the h1 property like so:

.logo h1 {
  font-family: "Euphemia UCAS";
  font-size: 200px !important;
  font-weight: normal;
  color: #222222;
}

How can I do this without modifying the original CSS? The !important value did not help.

link: https://dl.dropbox.com/u/3417415/Storify/mockups/screen1.html

4

2 に答える 2

17

CSSセレクターを正しく適用していません。

あなたの.logoクラスは、私があなたのコードで見ることができるものから、ヘッダータグ自体にあります。

代わりに、CSSは次のようになります。

h1.logo {
  font-family: "Euphemia UCAS";
  font-size: 200px !important;
  font-weight: normal;
  color: #222222;
}

このクラスが正確に適用されている場所を再確認してください。

また、HTMLをもう一度確認すると、次のようになります。

<h3 class="logo">Storify</h3>

したがって、CSSは実際には次のようになります。

h3.logo {
  font-family: "Euphemia UCAS";
  font-size: 200px !important;
  font-weight: normal;
  color: #222222;
}

それとも私はあなたをまったく誤解していますか？

于 2012-07-24T12:32:08.163 に答える
0

HTMLでスクリプト要素を使用できます。

スクリプト内でイベントハンドラーを追加します

addEventListener('load', function () {
   // Change your css properties here.
});

このようにして、cssスタイルの継承が発生しないことを確認できます。

于 2015-07-25T23:35:01.990 に答える