HTMLでリストをデコってみよう!

Uncategorized

どうもみなさんこんにちは!ryutaです今回は「HTMLでリストをデコってみよう!」というテーマで解説していきます!前回ただの箇条書きのリストの作り方を説明しましたが、それをさらに改良していくことができるんです!今回はそれをやっていこうと思います!前回の記事も読んでみてください!

では早速行って見ましょう。

ul要素について

実はli要素は囲む要素によって種類が変わるという特徴を持っている。

例えばul要素で囲むと黒点が先頭について、ol要素で囲むと数字が連番でつくという特徴があります。

このように要素を要素で囲むことを入れ子といいます。そしてかこむほうの要素を親要素、囲まれる方の要素を子要素という。

<ul>

<li>リスト</li>

<li>リスト</li>

</ul>

こうすることで、リストの先頭に黒点がつきます。

インデント

入れ子構造の要素がある場合はインデントと呼ばれる字下げをします。なんでこんなことをするかというと、コードが長くなって、複雑になった場合でも、親子関係がわかりやすくなるからです。

行の先頭でtadキーを押すと、簡単にインデントすることができます。

まとめ

ここで今回の記事のまとめです。li要素は囲む要素によって種類を変えることができるということ、要素を要素で囲む際はインデントをすることを覚えておきましょう!

コメント

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