個人練習用：サイトパーツ、アコーディオン
| 順位 | 名前 | スコア | 称号 | 打鍵/秒 | 正誤率 | 時間(秒) | 打鍵数 | ミス | 問題 | 日付 |
|---|---|---|---|---|---|---|---|---|---|---|
| 1 | mikaroko | 2036 | F+ | 2.0 | 97.6% | 673.3 | 1405 | 34 | 27 | 2025/10/31 |
関連タイピング
-
解説なしで、個人練習用のコードです。
プレイ回数409英語長文327打 -
日本語訳なし、しゃべることと歩くことの比較
プレイ回数670英語長文1097打 -
h2やh3のデザインのcssです。解説なしです。
プレイ回数338英語長文980打 -
beforeとafter要素を使った装飾です。
プレイ回数324英語長文517打 -
jQuery基本例文集です。解説なしです。
プレイ回数1003英語長文1554打 -
日本語訳なしの英語長文です。個人練習用につくりました。
プレイ回数555英語長文717打 -
個人練習用のコードです
プレイ回数828英語長文1787打 -
個人練習用の英語長文です。
プレイ回数642英語長文795打
問題文
(<!DOCTYPE html><html><head><meta charset="UTF-8">)
<!DOCTYPE html><html><head><meta charset="UTF-8">
(<title>accordion</title>)
<title>accordion</title>
(<link rel="stylesheet" href="css/acot.css"></head><body>)
<link rel="stylesheet" href="css/acot.css"></head><body>
(<div class="sample-accordion"><div class="ac-content">)
<div class="sample-accordion"><div class="ac-content">
(<label for="ac-cap1">1</label><input id="ac-cap1" type="checkbox">)
<label for="ac-cap1">1</label><input id="ac-cap1" type="checkbox">
(<div class="ac-cont"><p>1</p></div>)
<div class="ac-cont"><p>1</p></div>
(<label for="ac-cap2">2</label><input id="ac-cap2" type="checkbox">)
<label for="ac-cap2">2</label><input id="ac-cap2" type="checkbox">
(<div class="ac-cont"><p>2<br>2</p></div>)
<div class="ac-cont"><p>2<br>2</p></div>
(<label for="ac-cap3">3</label><input id="ac-cap3" type="checkbox">)
<label for="ac-cap3">3</label><input id="ac-cap3" type="checkbox">
(<div class="ac-cont"><p>3</p></div>)
<div class="ac-cont"><p>3</p></div>
(<label for="ac-cap4">4</label><input id="ac-cap4" type="checkbox">)
<label for="ac-cap4">4</label><input id="ac-cap4" type="checkbox">
(<div class="ac-cont"><p>4</p></div>)
<div class="ac-cont"><p>4</p></div>
(<label for="ac-cap5">5</label><input id="ac-cap5" type="checkbox">)
<label for="ac-cap5">5</label><input id="ac-cap5" type="checkbox">
(<div class="ac-cont"><p>5</p></div>)
<div class="ac-cont"><p>5</p></div>
(<!--ac-content--></div><!--sample-accordion--></div></body></html>)
<!--ac-content--></div><!--sample-accordion--></div></body></html>
(css start)
css start
(.sample-accordion { min-width: 300px; margin: 0 auto; padding: 0; })
.sample-accordion { min-width: 300px; margin: 0 auto; padding: 0; }
(.sample-accordion .ac-content { margin: 0; padding: 0; })
.sample-accordion .ac-content { margin: 0; padding: 0; }
(.sample-accordion input { display: none; })
.sample-accordion input { display: none; }
(.sample-accordion label { display: block; background: #9fb7d4; cursor: pointer;)
.sample-accordion label { display: block; background: #9fb7d4; cursor: pointer;
(padding: 10px; color: #fff; border-bottom: 1px solid #fff;)
padding: 10px; color: #fff; border-bottom: 1px solid #fff;
(box-sizing: border-box; })
box-sizing: border-box; }
(.sample-accordion label:hover { background: #ccc; })
.sample-accordion label:hover { background: #ccc; }
(.sample-accordion .ac-cont { transition: 0.2s; height: 0; overflow: hidden;)
.sample-accordion .ac-cont { transition: 0.2s; height: 0; overflow: hidden;
(background: #ddd; padding: 0 10px; box-sizing: border-box; })
background: #ddd; padding: 0 10px; box-sizing: border-box; }
(.sample-accordion input:checked + .ac-cont {)
.sample-accordion input:checked + .ac-cont {
(height: auto; padding: 10px; box-sizing: border-box; })
height: auto; padding: 10px; box-sizing: border-box; }