Momozono/html_study.html

## html_study.html
<!DOCTYPE html>
  <html lang="ja">
    <head>
      <meta charset="utf-8">
      <title>おいしいごはん！</title>
    <head>

    <body>
      <header>
        <div style="background:skyblue;">
          <h1>おいしいごはん！</h1>
          <nav>
            - Home
            - About
            - Profile
          </nav>
        </div>
      </header>

    <section>
      <h2>今日のおすすめメニュー！</h2>
      <article>
        <h2>至高のTKG</h2>
        <p><strong>至高のTKGの作り方には秘密があった...!</strong></p>
        <a href="#zairyo" target="_blank">材料についてはこちら</a>
        <h2>作り方</h2>
        <h3 id="zairyo">材料</h3>
          <ul>
            <li><span style="color:gold;">たまご</span></li>
            <li>秘伝のしょうゆ</li>
            <li>ごはん</li>
            <li>あじの素</li>
          </ul>
        <h3>作り方</h3>
          <ol>
            <li>ごはんを炊く</li>
            <li>茶碗にごはんをのせる</li>
            <li>卵をボウルに入れてかき混ぜる</li>
            <li>かき混ぜた卵をごはんにのせる</li>
            <li>完成！</li>
          </ol>

        <table>
          <thead>
            <tr>
              <th>Size</th><th>Price</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>S</td><td>180</td>
            </tr>
            <tr>
              <td>M</td><td>210</td>
            </tr>
            <tr>
              <td>L</td><td>240</td>
            </tr>
            <tr>
              <td colspan="2">free for kids!</td>
            </tr>
          </tbody>
        </table>

        <article>
          <h3>アンケート</h3>
          <form action="survey.php" method="post">
            <p>メールアドレス：<input type="text" name="email" size="50" maxlength="20" placeholder="input your email" disabled></p>
            <p>ログイン：<input type="password" name="password"></p>
            <p>コメント：
              <textarea name="comment" cols="40" rows="5">コメント</textarea>
            </p>
              Phone Type:
              <label>
                <input type="checkbox" name="phone" value="android" checked>Android
              </label>
              <label>
                <input type="checkbox" name="phone" value="iphone">iPhone
              </label>
            <p>
              Color:
              <label>
                <input type="radio" name="color" value="red" checked>Red
              </label>
              <label>
                <input type="radio" name="color" value="blue" >Blue
              </label>
            </p><!--片方どちらかしか選ばせないならラジオボタン-->
            <p>
              <button type="button"><strong>アクション！</strong></button>
            </p>
            <p>
              City:
              <select name="city" multiple size="6">
                <option value="tokyo" selected>Tokyo</option>
                <option value="osaka">Osaka</option>
                <option value="nagoya">Nagoya</option>
                <option value="kyoto">Kyoto</option>
                <option value="hiroshima">Hiroshima</option>
                <option value="hukuoka">Hukuoka</option>
              </select>
            </p>
            <p>
              「&lt;p&gt;タグは段落を表します。」
            </p>
            <input type="hidden" name="user_id" value="1234">
            <p><input type="submit" value="送信！" disabled></p>
          </form>
        </article>

        <hr>
        詳細は以下のリンクをクリック
        <a href="https://www.google.co.jp/search?q=google.com&oq=google.com&aqs=chrome..69i60l2j5j69i57j69i60l2.4707j0j7&sourceid=chrome&es_sm=91&ie=UTF-8#q=%E3%81%8A%E3%81%84%E3%81%97%E3%81%84TKG">クリック！</a>
      </article>
    </section>

    <section>
      <h1>昨日のおすすめメニュー！</h1>
        <article>
          <h1>しっとりパンケーキ</h1>
        </article>
    </section>

    <section>
      <h1>今月のおすすめメニュー！</h1>
        <article>
          <h1>おいしい変わり肉じゃが</h1>
        </article>
    </section>

    <aside>
      <h1>おすすめのレシピ本</h1>
      -　おすすめレシピBOOK
      -　おすすめレシピBOOK
      -　おすすめレシピBOOK
    </aside>
    <pre>
    これやこの
      いくもかへるもわかれては
        しるもしらぬもあふさかのせき
        </pre>

    <footer>
      このページはmomozonoによって作られています。
    </footer>

  </body>
</html>
	<!DOCTYPE html>
	<html lang="ja">
	<head>
	<meta charset="utf-8">
	<title>おいしいごはん！</title>
	<head>

	<body>
	<header>
	<div style="background:skyblue;">
	<h1>おいしいごはん！</h1>
	<nav>
	- Home
	- About
	- Profile
	</nav>
	</div>
	</header>

	<section>
	<h2>今日のおすすめメニュー！</h2>
	<article>
	<h2>至高のTKG</h2>
	<p><strong>至高のTKGの作り方には秘密があった...!</strong></p>
	<a href="#zairyo" target="_blank">材料についてはこちら</a>
	<h2>作り方</h2>
	<h3 id="zairyo">材料</h3>
	<ul>
	<li><span style="color:gold;">たまご</span></li>
	<li>秘伝のしょうゆ</li>
	<li>ごはん</li>
	<li>あじの素</li>
	</ul>
	<h3>作り方</h3>
	<ol>
	<li>ごはんを炊く</li>
	<li>茶碗にごはんをのせる</li>
	<li>卵をボウルに入れてかき混ぜる</li>
	<li>かき混ぜた卵をごはんにのせる</li>
	<li>完成！</li>
	</ol>

	<table>
	<thead>
	<tr>
	<th>Size</th><th>Price</th>
	</tr>
	</thead>
	<tbody>
	<tr>
	<td>S</td><td>180</td>
	</tr>
	<tr>
	<td>M</td><td>210</td>
	</tr>
	<tr>
	<td>L</td><td>240</td>
	</tr>
	<tr>
	<td colspan="2">free for kids!</td>
	</tr>
	</tbody>
	</table>

	<article>
	<h3>アンケート</h3>
	<form action="survey.php" method="post">
	<p>メールアドレス：<input type="text" name="email" size="50" maxlength="20" placeholder="input your email" disabled></p>
	<p>ログイン：<input type="password" name="password"></p>
	<p>コメント：
	<textarea name="comment" cols="40" rows="5">コメント</textarea>
	</p>
	Phone Type:
	<label>
	<input type="checkbox" name="phone" value="android" checked>Android
	</label>
	<label>
	<input type="checkbox" name="phone" value="iphone">iPhone
	</label>
	<p>
	Color:
	<label>
	<input type="radio" name="color" value="red" checked>Red
	</label>
	<label>
	<input type="radio" name="color" value="blue" >Blue
	</label>
	</p><!--片方どちらかしか選ばせないならラジオボタン-->
	<p>
	<button type="button"><strong>アクション！</strong></button>
	</p>
	<p>
	City:
	<select name="city" multiple size="6">
	<option value="tokyo" selected>Tokyo</option>
	<option value="osaka">Osaka</option>
	<option value="nagoya">Nagoya</option>
	<option value="kyoto">Kyoto</option>
	<option value="hiroshima">Hiroshima</option>
	<option value="hukuoka">Hukuoka</option>
	</select>
	</p>
	<p>
	「<p>タグは段落を表します。」
	</p>
	<input type="hidden" name="user_id" value="1234">
	<p><input type="submit" value="送信！" disabled></p>
	</form>
	</article>

	<hr>
	詳細は以下のリンクをクリック
	<a href="https://www.google.co.jp/search?q=google.com&oq=google.com&aqs=chrome..69i60l2j5j69i57j69i60l2.4707j0j7&sourceid=chrome&es_sm=91&ie=UTF-8#q=%E3%81%8A%E3%81%84%E3%81%97%E3%81%84TKG">クリック！</a>
	</article>
	</section>

	<section>
	<h1>昨日のおすすめメニュー！</h1>
	<article>
	<h1>しっとりパンケーキ</h1>
	</article>
	</section>

	<section>
	<h1>今月のおすすめメニュー！</h1>
	<article>
	<h1>おいしい変わり肉じゃが</h1>
	</article>
	</section>

	<aside>
	<h1>おすすめのレシピ本</h1>
	-　おすすめレシピBOOK
	-　おすすめレシピBOOK
	-　おすすめレシピBOOK
	</aside>
	<pre>
	これやこの
	いくもかへるもわかれては
	しるもしらぬもあふさかのせき
	</pre>

	<footer>
	このページはmomozonoによって作られています。
	</footer>

	</body>
	</html>