【HTML】順不同の箇条書きのリストを表すul要素を解説します

こんにちは。たいら(@tairaengineer2)です。
転職を繰り返し現在4社経験している、11年目エンジニアです。

この記事では、 HTMLで順不同の箇条書きのリストを表すul要素について

  • ul要素とは
  • ul要素を使ったサンプルプログラム

と、丁寧に解説していきます。

前提条件:実行環境について

実行環境は以下の通りです。

OS Windows10

ul要素とは

ul要素とは、順不同の箇条書きのリストを表す要素です。
「ul」とは「unordered list」の略で、和訳すると「順序不同リスト」という意味です。

ul要素を使うと
HTMLのul要素を解説
というように表すことができます。

書き方は

とul要素の中にli要素を使って箇条書きのリストを表します。
li要素は、リストの項目を表す要素です。
詳しくはこちらの記事をご参考ください。

ul要素には非推奨となっている属性が2つあります。

非推奨属性名 説明 書き方例
compact リストをコンパクトに表示するかを指定
type リストの項目先頭にある記号を指定

  • circle
  • disc
  • square

を指定できた

これら2属性は使わないようにご注意ください。

では、次の章で実際に使ってみます。

ul要素を解説するプログラムの概要

ul要素を解説するプログラムでは、HTMLファイル内で5つの項目を持つリストを作って表示させます。

サンプルプログラム

実行結果

作成したHTMLをブラウザで開きます。

HTMLのul要素を解説
ul要素に指定した内容でリストが表示されることが確認できました。

まとめ:ul要素を使ってみよう!

以上がHTMLのul要素についての解説でした!

あなたのご参考になったのなら、とても嬉しいです(*´▽`*)
ではでは~(・ω・)ノシ

コメント

タイトルとURLをコピーしました