個人練習用、h2装飾(上下に短い線)
beforeとafter要素を使った装飾です。
解説なしです。個人練習用に作りました。
| 順位 | 名前 | スコア | 称号 | 打鍵/秒 | 正誤率 | 時間(秒) | 打鍵数 | ミス | 問題 | 日付 |
|---|---|---|---|---|---|---|---|---|---|---|
| 1 | mikaroko | 2099 | F+ | 2.1 | 97.6% | 246.3 | 530 | 13 | 14 | 2025/12/16 |
関連タイピング
-
CSSの暗記用です
プレイ回数706 英語長文809打 -
自分練習用、英語長文:夢について
プレイ回数587 英語長文542打 -
Progateの復習用
プレイ回数744 長文547打 -
jQuery基本例文集です。解説なしです。
プレイ回数1021 英語長文1554打 -
フレックスボックスを覚えよう
プレイ回数3131 長文英字242打 -
CSS 3 暗記用です。
プレイ回数1038 英語長文481打 -
個人練習用の英語長文です。
プレイ回数671 英語長文795打 -
自分練習用、英語長文
プレイ回数2712 英語長文1127打
問題文
ふりがな非表示
ふりがな表示
(h2{ position: relative; display: inline-block;)
h2{ position: relative; display: inline-block;
(margin-bottom: 1em; })
margin-bottom: 1em; }
(h2:before { content: ''; position: absolute;)
h2:before { content: ''; position: absolute;
(left: 50%; top: -15px; display: inline-block;)
left: 50%; top: -15px; display: inline-block;
(width: 60px; height: 5px;)
width: 60px; height: 5px;
(-webkit-transform: translateX(-50%);)
-webkit-transform: translateX(-50%);
(transform: translateX(-50%); background-color: black;)
transform: translateX(-50%); background-color: black;
(border-radius: 2px; })
border-radius: 2px; }
(h2:after { content: ''; position: absolute;)
h2:after { content: ''; position: absolute;
(left: 50%; bottom: -15px; display: inline-block;)
left: 50%; bottom: -15px; display: inline-block;
(width: 60px; height: 5px;)
width: 60px; height: 5px;
(-webkit-transform: translateX(-50%);)
-webkit-transform: translateX(-50%);
(transform: translateX(-50%);)
transform: translateX(-50%);
(background-color: black; border-radius: 2px; })
background-color: black; border-radius: 2px; }