あまり一般的ではないが便利な CSS 属性操作の完全ガイド

::選択{
  背景: 赤;
  色: 黒;
}

ビデオ::-内部メディアコントロールダウンロードボタン{
    表示:なし;
}

ビデオ::-webkit-メディアコントロールエンクロージャ {
    オーバーフロー:非表示;
}

ビデオ::-webkit-メディアコントロールパネル{
    幅: calc(100% + 30px); 
}

/* * 他のセレクターを変更することもできます*/
*::-webkit-スクロールバー{
    幅: 2px;
  高さ: 2px;
}
*::-webkit-スクロールバー-サムネイル {
  境界線の半径: 5px;
  ボックスシャドウ: インセット 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: インセット 0 0 5px rgba(0, 0, 0, 0.2);
  背景: #00063a;
}
*::-webkit-スクロールバートラック{
  ボックスシャドウ: インセット 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: インセット 0 0 5px rgba(0, 0, 0, 0.2);
    境界線の半径: 0;
  背景: #00063a;
}

入力::-webkit-outer-spin-button、
入力::-webkit-インナースピンボタン{
    -webkit-appearance: なし;
}
入力[type="数値"]{
    -moz-appearance:テキストフィールド;
}

<スタイル>
    。箱 {
        幅: 150ピクセル;
        境界線: 2px 破線 #fff;
        背景: 線形グラデーション(下へ、#34538b、#cd0000);
        背景の原点: 境界線ボックス;
    }
    。コンテンツ {
        高さ: 100px;
        背景色: #fff;
    }
</スタイル>
<div class="box">
    <div class="content"></div>
</div> 

<スタイル タイプ="text/css">
	。コンテンツ { 
		幅: 100ピクセル; 
	   	高さ: 100px; 
	    ボックスのサイズ: 境界線ボックス; 
	    パディング: 5px; 
	    境界線の半径: 50%; 
	    背景画像: -webkit-linear-gradient(上、赤 0%、青 30%、黄 60%、緑 90%);  
	    背景画像: -moz-linear-gradient(上、赤 0%、青 30%、黄 60%、緑 90%); 
	    背景画像: 線形グラデーション(上、赤0%、青30%、黄60%、緑90%);  
	}
	。箱 { 
		幅:100%; 
	    高さ:100%; 
	    境界線の半径:50%; 
	    背景:#fff; 
	}
</スタイル>
<div class="content">
	<div class="box"></div>
</div> 

入力{
    キャレットの色: 赤;
} 

。箱 {
    幅: 300ピクセル; 高さ: 300ピクセル;
    背景: 円錐グラデーション(45度から、白、黒、白);
} 

波状の
    表示: ブロック;
    高さ: .5em;
    空白: ラップなし;
    文字間隔: 100vw;
    パディングトップ: .5em;
    オーバーフロー: 非表示;
}
波状::前{
    内容: "\2000\2000";
    /* IE ブラウザでは実線になります */
    テキスト装飾: 上線;
    /* 最新のブラウザ */
    テキスト装飾: 波線上線;
} 

<スタイル タイプ="text/css" メディア="screen">
.div1{
	幅: 0;
	高さ: 0;
	境界線: 100px 実線;
	<!--右上 左下-->
	border-color: 赤 透明 透明 透明;
}
</スタイル>
<div class="div1"></div> 

背景: url(https://img.alicdn.com/imgextra/i4/1881744325/O1CN01JBktT81hotb8c6Py0_!!1881744325.png) 中央 繰り返しなし、線形グラデーション(下へ、赤、#3c3f40); 

/*スクロールバーの幅、高さ、背景を定義します。幅と高さはそれぞれ水平スクロールバーと垂直スクロールバーのサイズに対応します*/
::-webkit-スクロールバー{
    幅: 5px;
    高さ: 5px;
    背景色: rgba(245, 245, 245, 0.47);
}
 
/*スクロールバーのトラック、内側の影、丸い角を定義します*/
::-webkit-スクロールバートラック{
    -webkit-box-shadow: インセット 0 0 6px rgba(0, 0, 0, .3);
    境界線の半径: 10px;
    背景色: #f5f5f5;
}
 
/*スライダー、内側の影、丸い角を定義します*/
::-webkit-スクロールバー-サムネイル {
    /*幅: 10px;*/
    高さ: 20px;
    境界線の半径: 10px;
    -webkit-box-shadow: インセット 0 0 6px rgba(0, 0, 0, .3);
    背景色: rgba(85, 85, 85, 0.25);
}

入力::-webkit-入力プレースホルダー { 
    /* WebKit ブラウザ */ 
    フォントサイズ:14px;
    色: #333;
} 
入力::-moz-プレースホルダー{ 
    /* Mozilla Firefox 19 以降 */ 
    フォントサイズ:14px;
    色: #333;
} 
入力:-ms-入力プレースホルダー{ 
    /* インターネット エクスプローラー 10 以上 */ 
    フォントサイズ:14px;
    色: #333;
}