CSSは、バックグラウンドチェックボックスを変更します

チェックボックスのデフォルトの背景色は、擬似希土類元素を使用して実装、変更することはできません、基本的な原理は、新しい要素を挿入する前に/後に使用することです。そして、オリジナルのスタイル上書き背景色や背景画像の新しい要素を活用します。

元の外観

 

外観を実現するために、

 

<input type = "チェックボックス" />

入力[タイプ=チェックボックス] { 
    カーソル：ポインタ。
    位置：相対 ; 
  } 
  
  入力[タイプ=チェックボックス]：後 { 
    位置：絶対。
    幅：10pxの ; 
    高さ：10pxの ; 
    内容："" ; 
    背景色：RGB（200237255） 。
    可視性：可視。
    border-top：1pxの固体#CCC。
    border-left：1pxの固体#CCC。
  } 
  
  入力[タイプ=チェックボックス]：チェック：後 { 
    内容："✔" 。
    位置：絶対 ; 
    行の高さ：11px ; 
    左：0 ; 
    トップ：0 ; 
  }