特化なしでクラスをオーバーライドする方法は？

Question

私はbase.css、layout.css、contents.cssの3つのscssファイルを持っています。

<link rel="stylesheet" href="base.css"> 
<link rel="stylesheet" href="layout.css"> 
<link rel="stylesheet" href="contents.css"> 

base.cssは、要素のデフォルトのスタイルのためにある：私は、次のように宣言します。私はheader、footer、およびwrapperのウェブサイトにlayoutを使用しています。 contents.cssについては、その名前はそれ自体について語ります。はい、それはウェブサイトのすべての内容です。私は別にそれを得たので、私は実際に特異性を使用しません。

base.css

input { 
    padding: 12px 0 12px 0; 
} 

layout.css

layout-wrapper{ 
    /*some styles*/ 
} 

contents.css

input { 
    font-size:1.5em; 
    padding: 2px 0 2px 0; 
} 

I：例えばのようにcontents.cssのinputをオーバーライドすると、base.cssのスタイルが最初に読み取られてからcontents.cssになります。私はなぜそれがうまくいけなかったので他の要素のinputのために働かないのだろうか。私は私のinput要素に特異性を置けば、私は私の目標を達成することができますが、それは次のようになります。これは、レイアウトとコンテンツを分離する目的を台無しにしてしまう

layout-wrapper{ 
      /*some styles*/ 

    input { 
     font-size:1.5em; 
     padding: 2px 0 2px 0; 
    } 
} 

contents.css。だから私の質問はどのように私は入力スタイルを任意の特異性なくコンテンツからオーバーライドできますか？

Answer 1

ファイルを分離していても、特定性はあなたの問題に対する答えですが、他の人は!importantを使用してもよいと思いますが、それはどうしても避けてください。

Answer 2

デフォルトのCSSのデフォルト入力と同じように、defaul diffクラス名または要素名を指定する必要があります