HTML初級(Progate編)
HIML初級編での流れをタイピングでやる事により、実践的に内容を覚える事ができます。
文字数制限がある為、一部文を分けている場所があります。
関連タイピング
-
このタイピングで一位になれる人いないでしょ！
プレイ回数4749141打 -
タイピング練習を始めたばかりの方にオススメ！
プレイ回数465万短文かな312打 -
プレイ回数9482歌詞かな139打 -
毎日やればタイピングが上達します
プレイ回数264万703打 -
数字・記号の配置を覚えましょう！！！
プレイ回数924496打 -
ウォーデンでも強いのに、超超超超巨大ウォーデンなんて......
プレイ回数13万かな254打 -
タイピング速度測定(タイ速)｜30秒のタイピングゲーム
プレイ回数11万長文かな30秒 -
指の練習に！時間制限はありません。
プレイ回数2530長文かな1769打
問題文
(＜！ｄｏｃｔｙｐｅ ｈｔｍｌ＞)
<!DOCTYPE html>
(＜ｈｔｍｌ＞＜／ｈｔｍｌ＞)
<html></html>
(＜ｈｅａｄ＞＜／ｈｅａｄ＞)
<head></head>
(＜ｍｅｔａ ｃｈａｒｓｅｔ＝”ｕｔｆ－８”＞)
<meta charset="utf-8">
(＜ｔｉｔｌｅ＞＜／ｔｉｔｌｅ＞)
<title></title>
(＜ｌｉｎｋ ｒｅｌ＝”ｓｔｙｌｅｓｈｅｅｔ”)
<link rel="stylesheet"
(ｈｒｅｆ＝”ｓｔｙｌｅｓｈｅｅｔ．ｃｓｓ”＞)
href="stylesheet.css">
(＜ｂｏｄｙ＞＜／ｂｏｄｙ＞)
<body></body>
(＜ｄｉｖ ｃｌａｓｓ＝”ｈｅａｄｅｒ”＞＜／ｄｉｖ＞)
<div class="header"></div>
(＜ｄｉｖ ｃｌａｓｓ＝”)
<div class="
(ｈｅａｄｅｒ－ｌｏｇｏ”＞ｐｒｏｇａｔｅ＜／ｄｉｖ＞)
header-logo">Progate</div>
(＜ｄｉｖ ｃｌａｓｓ＝”ｈｅａｄｅｒ－ｌｉｓｔ”＞＜／ｄｉｖ＞)
<div class="header-list"></div>
(＜ｕｌ＞＜／ｕｌ＞)
<ul></ul>
(＜ｌｉ＞ぷろぐらみんぐとは＜／ｌｉ＞)
<li>プログラミングとは</li>
(＜ｌｉ＞まなべるれっすん＜／ｌｉ＞)
<li>学べるレッスン</li>
(＜ｌｉ＞おといあわせ＜／ｌｉ＞)
<li>お問い合わせ</li>
(＜ｄｉｖ ｃｌａｓｓ＝”ｍａｉｎ”＞＜／ｄｉｖ＞)
<div class="main"></div>
(＜ｄｉｖ ｃｌａｓｓ＝”ｃｏｐｙ－ｃｏｎｔａｉｎｅｒ”＞＜／ｄｉｖ＞)
<div class="copy-container"></div>
(＜ｈ１＞ｈｅｌｌｏ ｗｏｒｌｄ＜ｓｐａｎ＞．＜／ｓｐａｎ＞＜／ｈ１＞)
<h1>HELLO WORLD<span>.</span></h1>
(＜ｈ２＞ぷろぐらみんぐのせかいへようこそ＜／ｈ２＞)
<h2>プログラミングの世界へようこそ</h2>
(＜ｄｉｖ ｃｌａｓｓ＝”ｃｏｎｔｅｎｔｓ”＞＜／ｄｉｖ＞)
<div class="contents"></div>
(＜ｈ３ ｃｌａｓｓ＝”ｓｅｃｔｉｏｎ－ｔｉｔｌｅ)
<h3 class="section-title
(”＞まなべるれっすん＜／ｈ３＞)
">学べるレッスン</h3>
(＜ｄｉｖ ｃｌａｓｓ＝”ｃｏｎｔｅｎｔｓ－ｉｔｅｍ”＞＜／ｄｉｖ＞)
<div class="contents-item"></div>
(＜ｉｍｇ ｓｒｃ＝””＞)
<img src="">
(＜ｐ＞ｈｔｍｌ ＆ ｃｓｓ＜／ｐ＞)
<p>HTML & CSS</p>
(＜ｐ＞ｐｈｐ＜／ｐ＞)
<p>PHP</p>
(＜ｐ＞ｒｕｂｙ＜／ｐ＞)
<p>Ruby</p>
(＜ｐ＞ｓｗｉｆｔ＜／ｐ＞)
<p>Swift</p>
(＜ｄｉｖ ｃｌａｓｓ＝”ｃｏｎｔａｃｔ－ｆｏｒｍ”＞＜／ｄｉｖ＞)
<div class="contact-form"></div>
(＜ｈ３ ｃｌａｓｓ＝”ｓｅｃｔｉｏｎ－ｔｉｔｌｅ)
<h3 class="section-title
(＜ｐ＞めーるあどれす（ひっす）＜／ｐ＞)
<p>メールアドレス（必須）</p>
(＜ｉｎｐｕｔ＞)
<input>
(＜ｐ＞おといあわせないよう（ひっす）＜／ｐ＞)
<p>お問い合わせ内容（必須）</p>
(＜ｔｅｘｔａｒｅａ＞＜／ｔｅｘｔａｒｅａ＞)
<textarea></textarea>
(＜ｐ＞ひっすこうもくはかならずごにゅうりょくください＜／ｐ＞)
<p>必須項目は必ずご入力ください</p>
(＜ｉｎｐｕｔ ｃｌａｓｓ＝”ｃｏｎｔａｃｔ－ｓｕｂｍｉｔ)
<input class="contact-submit
(” ｔｙｐｅ＝”ｓｕｂｍｉｔ” ｖａｌｕｅ＝”そうしん”＞)
" type="submit" value="送信">
(＜ｄｉｖ ｃｌａｓｓ＝”ｆｏｏｔｅｒ”＞＜／ｄｉｖ＞)
<div class="footer"></div>
(＜ｄｉｖ ｃｌａｓｓ＝”ｆｏｏｔｅｒ－ｌｏｇｏ)
<div class="footer-logo
(”＞ｐｒｏｇａｔｅ＜／ｄｉｖ＞)
">Progate</div>
(＜ｄｉｖ ｃｌａｓｓ＝”ｆｏｏｔｅｒ－ｌｉｓｔ”＞＜／ｄｉｖ＞)
<div class="footer-list"></div>
(＜ｕｌ＞＜／ｕｌ＞)
<ul></ul>
(＜ｌｉ＞かいしゃがいよう＜／ｌｉ＞)
<li>会社概要</li>
(＜ｌｉ＞さいよう＜／ｌｉ＞)
<li>採用</li>
(＜ｌｉ＞おといあわせ＜／ｌｉ＞)
<li>お問い合わせ</li>
(つぎはｃｓｓ（しょきゅうへん）をやってね。)
次はCSS(初級編)をやってね。