HTML CSS - 2017-01-16

新規案件のコーディング時に追加しときたいCSS

スクロールバーのパーツごとに色を設定する

webkitを使ったスクロールバーのカスタマイズです。
※Firefox未対応です。

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #DDD; }
::-webkit-scrollbar-thumb { background: #000; }
::-webkit-scrollbar-thumb:window-inactive { background: #000; }
::-webkit-scrollbar-thumb:hover { background: #2098A8; }
::-webkit-scrollbar-thumb:window-inactive:hover { background: #2098A8; }

テキスト選択時の文字色・背景色を設定する

テキストを選択した箇所のハイライトカラーを変更します。
当サイトでもしてますがちょっと変更するだけでイメージ変わりますよね。

::selection {background: #000; color: #fff;}
::-moz-selection {background: #000; color: #fff;}
Related Posts

Related Posts

便利なSassの@mixin集めました

2017-03-31