mamohoのＨＰ作成講座

リスト　記号編

●　リストを書いてみよう

簡単なリストを書いてみましょう

好きなくだものは？ 
<ul>
<li> みかん </li>
<li> りんご </li>
<li> バナナ </li>
<li> いちご </li>
<li> ぶどう </li>
</ul>

すると　下記のようになります

好きなくだものは？

リストの全体を　<ul>で囲んでいますね
リスト項目を　<li>で囲んでいます　後の</li >は　なくても大丈夫です各項目の行頭に　●がついてますが　使用フォントやパソコンの環境によっては
■　にみえることもあるようです

今度は　行頭の記号を変えてみましょう<ul　のあとに　リスト行頭記号を disc　square　circle　で指定します

使用フォントや　パソコンの環境によって記号がかわってしまうことがあるようです

好きなくだものは？ 
<ul type="square">
<li> みかん </li>
<li> りんご </li>
<li> バナナ </li>
<li> いちご </li>
<li> ぶどう </li>
</ul>

すると　下記のようになります

好きなくだものは？

リストの　●　が　■　になっているのがわかるでしょうか？

では　リストの途中で　記号はかえられないのでしょうか？
これが　出来るんです
今までは　<ul>のあとにタイプを指定していました
つまり　リスト全体に指定をかけていたわけです　
で　今度は　各項目ごとに指定をかけてやるわけです

好きなくだものは？ 
<ul>
<li> みかん </li>
<li type="square"> りんご </li>
<li type="circle"> バナナ </li>
<li type="disc">> いちご </li>
<li> ぶどう </li>
</ul>

すると　こんな感じになります

好きなくだものは？

お察しの通り　disc　は　何も指定していないときと同じです

まぁ　こんな書き方をする人は　おそらく居ないでしょうね（笑）でも　こんなこともできる　ということを覚えておきましょう

ジャンル別一覧

人気のクチコミテーマ

スマートフォン版を閲覧 | PC版を閲覧