web-dev-qa-db-ja.com

外部CSSをオーバーライドする方法は？

コンテンツdivに35pxのパディングを適用する外部cssファイルがあります。私のすべてのhtmlページはそのdiv内にロードされますが、そのうちの1つには0パディングを使用します-右。

インラインcssを試し、そのページの本文に直接適用し、！importantを使用しましたが、何も機能しませんでした。

私は何を間違っているのですか？

index.html：

<div id="content"><?php include "page.html"?></div>

main.css：

#content{
    margin-top: 303px;
    padding: 35px;
    z-index:1;
}

page.html：

<body style="padding:0px;">
csshtmloverridingpadding
6
zefs

Fluidbyteは正しかった、私は間違った要素に0パディングを適用しようとして愚かだった。追加

<style>
#content{
    padding-right:0px;  
}
</style>

page.htmlで正常に動作し、外部cssをオーバーライドします。

2
zefs

Css設定を上書きするには、キーワードimportantを使用する必要があります。

<body style="padding:0px ! important;">
17
Armando Peña

CSSはトップダウンで読み取るため、コードの下位にあるものはすべて上書きする必要があります。 http://jsfiddle.net/PFx9h/ を参照してください。

何かが有効になっていない場合は、それをオーバーライドする他のコードがあるためです。 Webkit Dev ToolsやFirebugなどの要素インスペクターを使用して、適用されているスタイルとその方法を確認します。

編集：

コードを投稿したため、bodyスタイルはdivには適用されません。

7
Fluidbyte

コンテンツdivインラインにstyle="padding:0px;"を適用するか（非推奨）、外部スタイルシートをロードした後にスタイルをロードします。ボディにstyle="padding:0px;"を適用すると、ボディにのみ影響し、ボディ内のすべての要素に適用されるわけではありません。

0
j08691