vue uiフレームスタイルの変更要約スタイルの貫通

1362 ワード

説明
1、方法1:グローバルなスタイルを構成するには、vuxがどのようにスタイル変数でテーマの配色を変更するかを確認してください(vuxは例を挙げるだけで、他のuiフレームワークも探して、似たような構成があるかどうかを見てください).2、方法2:グローバルスタイルレベルのオーバーライド.简単に言えば、私たちが普段html、cssを书いているのと変わらない、index.html導入すればいい
    .el-input__inner {
        height: 48px;
    }

プリコンパイラを使用する必要がある場合は、styleを直接書くscopedを付けないように注意してください.書かれたスタイルはグローバルスタイルで、優先度の問題があれば追加します.important


3、ローカルスタイルの修正は単一ルートのuiフレームスタイルだけを修正する必要があり、グローバルスタイルに影響を与えたくない場合があります.まず考えられるのは...


直接styleを書いてscopedを付けないように注意して、1つのコンポーネントの最外層のclassで包んで、すべてのコンポーネントのスタイルに変更しません.ポイントはscopedを付けないことです.このオプションのscoped属性は、data-v-21 e 5 b 78などの一意の属性を自動的に追加し、コンポーネント内のCSSに役割ドメインを指定し、コンパイルするときです.List-container:hoverは類似にコンパイルされます.List-container[data-v-21 e 5 b 78]:hover、uiフレームワークのelはこのコンパイルに参加していないので、書くスタイルは有効ではありません.では質問ですが、scopedを加えるとuiフレームのスタイルを修正できないのではないでしょうか.答えはもちろん否定的で、「スタイル貫通」という名詞があります.書き方も簡単です.


最初はstylusのスタイル貫通>>>広く使われていましたが、lessやsassのドキュメントは少なく、検索して多くのサイトが目立たない位置に/deep/があるかもしれませんが、一応/deep/はlessやsassのスタイル貫通ですが、どうせ私が使っているのは楽しいですね、ハハハ