css filterを使おう

背景
投稿者投稿者パンサーfkいいね0お気に入り登録
プレイ回数713難易度(4.1) 333打 長文
タグcss filter
自分暗記用

関連タイピング

問題文

ふりがな非表示 ふりがな表示

(filter:brightness(100%);)

明度 基準100% 0%で真っ黒

(filter:contrast(100%);)

コントラスト 100%が基準 0%で灰色

(filter:saturate(100%);)

彩度 100%基準 0%でモノクロgrayscale(100%)と同じ

(filter:grayscale(100%);)

モノクロ 100%で完全に白黒

(filter:sepia(100%);)

0%が基準100%に近いほど茶色がかったセピア調

(filter:invert(100%);)

諧調反転 0%基準 50%で灰色 100%で色輝度が反転(ネガ)

(filter:hue-rotate(180deg);)

色調回転 180degで反転 360degで元に戻る

(filter:blur(5px);)

ぼかし

(filter:drop-shadow(5px 5px 10px gray);)

影 水平 垂直 ぼかし 色(初期の色はblack)

(filter:opacity(70%);)

透過 opacity:と同じ 100%が基準0%で透明

(filter:brightness(80%)saturate(170%);)

複数使用 続けて入力するだけ

(background-color:rgba(255,255,255,0.3);)

要素の背後領域を透過

(backdrop-filter:blur(5px);)

要素の背後の領域に適用