個人練習用:ブログパーツ、h2やh3の装飾CSS

背景
投稿者投稿者ueshin0620いいね0お気に入り登録
プレイ回数341難易度(4.5) 980打 英語
h2やh3のデザインのcssです。解説なしです。
最初から順番に下線、点線、二重線、上下線、塗りつぶし、線で囲む、左線、立体、影、蛍光マーカー風、両端が線。のh2,h3のCSSを書いています。最後のだけちょっと長いです。

関連タイピング

問題文

ふりがな非表示 ふりがな表示
(h2 { border-bottom: solid 3px black; }) h2 { border-bottom: solid 3px black; } (h2 { border-bottom: dashed 2px #6594e0; }) h2 { border-bottom: dashed 2px #6594e0; } (h2 { border-bottom: double 5px #FFC778; }) h2 { border-bottom: double 5px #FFC778; } (h2 { color: #364e96; padding: 0.5em 0;) h2 { color: #364e96; padding: 0.5em 0; (border-top: solid 3px #364e96;) border-top: solid 3px #364e96; (border-bottom: solid 3px #364e96; }) border-bottom: solid 3px #364e96; } (h2 { background: #c2edff; padding: 0.5em; }) h2 { background: #c2edff; padding: 0.5em; } (h2 { color: #364e96; border: solid 3px #364e96;) h2 { color: #364e96; border: solid 3px #364e96; (padding: 0.5em; border-radius: 0.5em; }) padding: 0.5em; border-radius: 0.5em; } (h2 { padding: 0.25em 0.5em; color: #494949;) h2 { padding: 0.25em 0.5em; color: #494949;
(background: transparent; border-left: solid 5px #7db4e6; }) background: transparent; border-left: solid 5px #7db4e6; } (h2 { padding: 0.4em 0.5em; color: #494949;) h2 { padding: 0.4em 0.5em; color: #494949; (background: #f4f4f4; border-left: solid 5px #7db4e6;) background: #f4f4f4; border-left: solid 5px #7db4e6; (border-bottom: solid 3px #d7d7d7; }) border-bottom: solid 3px #d7d7d7; } (h2 { padding: 0.5em; background: aliceblue;) h2 { padding: 0.5em; background: aliceblue; (box-shadow: 0 0 4px rgba(0, 0, 0, 0.23); }) box-shadow: 0 0 4px rgba(0, 0, 0, 0.23); } (h1 { background: linear-gradient(transparent 70%, #a7d6ff 70%); }) h1 { background: linear-gradient(transparent 70%, #a7d6ff 70%); } (h3 { position: relative; display: inline-block; padding: 0 55px; }) h3 { position: relative; display: inline-block; padding: 0 55px; } (h3:before, h3:after { content: ''; position: absolute;) h3:before, h3:after { content: ''; position: absolute; (top: 50%; display: inline-block; width: 45px;) top: 50%; display: inline-block; width: 45px;
など
(height: 1px; background-color: black; }) height: 1px; background-color: black; } (h3:before { left:0; } h3:after { right: 0; }) h3:before { left:0; } h3:after { right: 0; }
問題文を全て表示 一部のみ表示 誤字・脱字等の報告

ueshin0620のタイピング

オススメの新着タイピング

タイピング練習講座 ローマ字入力表 アプリケーションの使い方 よくある質問

人気ランキング

注目キーワード