0
私は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。だから私の質問はどのように私は入力スタイルを任意の特異性なくコンテンツからオーバーライドできますか？
本当に必要な場合以外は、私は使用したくありません。本当に特異性以外の方法はありませんか？私が特異性を追加すると、私のscssは5-6レベル深くなります。私は、すべての費用がそれ以上深くなることを望んでいません。順序付けられていないリストのため、その深さは4-5レベルです。 – user3771102
次に、入力するクラスを追加し、より具体的なクラスを使用して入力をあなたのcontent.cssスタイルで入力します。それは私が与えた答えです。 - 特異性 - [特異度計算機]（https：//特異性）をチェックします。 – dippas
私は良い特異性を置く方法を知っていますが、私の問題は私がそれを行うと私のコードが繰り返されることです。可能な限り私は自分のコードを再利用したい。 – user3771102