1
1

More than 1 year has passed since last update.

HTML基本

Last updated at Posted at 2022-10-09

コメントアウト

mac:command+/

<!--表示されない-->

改行 br要素

改行したいところに<br>をつけることで改行できる

  <body>
    html
    <br>
    css
  </body>

スクリーンショット 2022-10-13 3.48.45.png
[br要素:MDNリンク]https://developer.mozilla.org/ja/docs/Web/HTML/Element/br

区切り hr要素

区切り線をつけたい部分に<hr>で区切りをつけることができる

  <body>
    html
    <hr>
    css
  </body>

スクリーンショット 2022-10-13 3.42.52.png

リスト ul要素/ol要素

順序なし ul要素/順序有り ol要素

  <body>
    <ul>
      <li>html</li>
      <li>css</li>
    </ul>

    <ol>
      <li>htnl</li>
      <li>css</li>
    </ol>
  </body>

スクリーンショット 2022-10-13 3.51.34.png

[ul要素MDN]https://developer.mozilla.org/ja/docs/Web/HTML/Element/ul
[ol要素MDN]https://developer.mozilla.org/ja/docs/Web/HTML/Element/ol

入れ子になったリスト(ネストしたリスト)

  <body>
    <ul>
      <li>ごはん</li>
      <li>パン
        <ul>
          <li>メロンパン</li>
          <li>あんぱん</li>
        </ul>
      </li>
    </ul>
  </body>

スクリーンショット 2022-10-15 1.06.13.png

説明リスト

一連の用語と説明をリスト化したもの

  <body>
    <dl>
      <dt>用語1</dt>
      <dd>説明1</dd>

      <dt>用語2</dt>
      <dd>説明2</dd>

      <dt>用語3</dt>
      <dd>説明3</dd>
    </dl>
  </body>

スクリーンショット 2022-10-15 1.09.54.png

強調

strong要素を使用すると強調できる

  <body>
    <p>html<strong>css</strong>javascript</p>
  </body>

スクリーンショット 2022-10-15 1.14.39.png

著作権表記をしたい場合

small要素

span要素

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1