TIL 08|CS-04(スタイル継承、選択者優先)


CSSのスタイル継承、選択者優先順位について

スタイルの継承


コンセプト


親要素、親要素に適用されるスタイルから子要素に継承された概念

継承されたCSS属性

  • は、すべての文字/文字属性が
  • を継承するわけではありません.
  • ですが、文字に関連する属性は
  • を継承します.
  • font-style:斜体
  • font-weight:字高
  • font-size:フォントサイズ
  • font-ファミリー:フォント(フォント)
  • 行-高さ:行高さ
  • color
  • text-align:ソート
  • 強制継承


    実際に継承されていないCSSコンテンツを強制的に継承できます
    親要素のheight値が変更されると、サブ要素の値も変更されます.
    .parent{
    	height:200px;
        	weight:200px;
        }
        
     .child{
    	height:inherit;
        	weight:200px;
        }   
        

    選択者優先度


    優先度とは、同じ要素が複数の宣言のターゲットになった場合に、どの宣言のCSS属性が優先されるかを決定する方法です.
  • 点、優先声明
  • のスコアが同じである場合、最後に説明された宣言は
  • より優先される.
  • 分表
  • 回線宣言:1000時
  • !重要情報:無限分数(重要度、明示度)
  • id選択者:100分
  • 類選択者:10分
  • tag選択者:1分
  • 全選者:0点
  • 継承には追加スコアは適用されません.
  • 問題
    .list li .item:21分
    .box::before:11点(仮想要素=tagセレクタ)
    .listli:hover:21ポイント(hover=仮想クラスセレクタ)
    :not(.box):10点(否定選択者計算点数x)