0

テーマの作成者から編集しないようにアドバイスされている、Wordpress CSS テーマに次のセレクターがあります。

.entry img, img.thumbnail {
  margin-bottom: 10px;
  padding: 2px;
  border: 1px solid #DDD;
  background: white;
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

そこで、上記の CSS セレクターの効果を「キャンセル」しようとするために、これを補助 CSS に追加しました。

.entry img, img.thumbnail { 
    margin-bottom: 0px; 
    padding: 0px; 
    border: 0px; 
    background: #fff;  
    -moz-box-shadow: 0;
    -webkit-box-shadow: 0;
    box-shadow: 0;
}

しかし、それは何も変わっていないようです。上記のスニペットで何を編集する必要があるのか​​ わかりません。

Google Chromes インスペクタで次のオプションを手動でオフにすると、取り除こうとしている境界線が消えます。

  • -moz-box-shadow
  • -webkit-box-shadow
  • ボックスシャドウ
4

4 に答える 4

1

私は!すべてのCSSルールにとって重要です。または、ラッパーdivを追加してcssで使用することもできます。

好き

HTML

<div id="wraper_div">
<div class="your_class"></div>
</div>

CSS:

#wraper_div .your_class{
/*CSS PROPERTY*/
}
于 2012-11-30T11:46:58.393 に答える
0

0 の代わりにnoneを使用すると、問題が解決します。CSS スタイルの順序も重要です。これらのスタイルは必ず CSS の最後に配置してください。

ワーキングデモ

.entry img, img.thumbnail { 
    margin-bottom: 0px; 
    padding: 0px; 
    border: 0px; 
    background: #fff;  
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
于 2012-11-30T11:16:39.700 に答える
0

たとえば Chrome で要素を検査すると、デフォルトのルールの後にルールが適用されますか?

その場合は、オーバーライドするために !important を追加してみてください。

.entry img, img.thumbnail { 
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
于 2012-11-30T11:17:30.597 に答える
0

1位

影はなしに設定する必要があります

2.

IE では速記によるリセットに問題があるため、バックグラウンドは速記なしでリセットする必要があります。

試す

background-color:#fff 

それ以外の

background:#fff

3.

「特異性」というものがあります。

あなたのコードは、それがオーバーライドするコードと同じ特異性を持っているので、オーバーライドするコードの下にあるか、より高い特異性を持っている必要があります。

もう 1 つのセレクターでコードをターゲットにしてみてください。

.entry img, img.thumbnail

より高い特異性:

body .entry img, body img.thumbnail

仕様とは、CSS ルールの「権限」を意味します。セレクターが異なれば、「重み」も異なります。

ID の重みは 100、クラスは 10、要素セレクターは 1 です。

.entry img, img.thumbnail

最初のステートメントは 11 で、2 番目のステートメントは 10 です。両方の前に body を追加して +1 の具体性を与え、古いコードを上書きします。

5.

古い IE をサポートしたい場合は、img.thumbnail を緩めてください。IE で問題が発生する可能性があります。.thumbnail のみに置き換えてください。クラス .thumbnail と img 要素を持つ要素が他にない場合は、これを行うことができます。

それが役立つことを願っています。

于 2012-11-30T11:27:53.277 に答える