装飾リスト/HTMLタグ素材集

装飾リスト

管理人お勧めのポイントを本当に現金に出来たサイト＆アプリ
モッピー	トリマ

シンプルリスト

リンクリスト

装飾リスト

装飾リスト１(黒板風)

項目１
項目２
項目３
項目４
項目５

[font-size:14px;]は文字の大きさ、数字の大小で文字の大きさを変えられます
[width="230"]は横の範囲の長さ、数字を増やすと横に長くなります
[color:#ffffff;]の#ffffffのカラーコードを変更すると文字の色を変えられます
[border:5px solid #950000;]のカラーコードも↑同様で枠線の色を変えられます
　　　　↑[5px]は枠線の太さ、数字が大きいほど枠線が太くなります
[background-color:#009500;]の#009500のカラーコードを変更すると背景の色を変えられます
[li type="記号の種類"]は[disc(塗りつぶし円)][circle(中抜き円)][square(塗りつぶし四角)]

<div style="font-size:14px;color:#ffffff;
width:230;border:5px ridge #950000;background-color:#009500;padding:10px;margin:auto;">
<ul style="margin:0px 0px 0px 15px;text-align:left;">
<li type="disc">項目１
<li type="disc">項目２
<li type="disc">項目３
<li type="disc">項目４
<li type="disc">項目５
</ul></div>

装飾リスト２(ポップ風)

項目１
項目２
項目３
項目４
項目５

[font-size:14px;]は文字の大きさ、数字の大小で文字の大きさを変えられます
[width="230"]は横の範囲の長さ、数字を増やすと横に長くなります
[color:#ff0080;]の#ff0080のカラーコードを変更すると文字の色を変えられます
[border:5px solid #ff0080;]のカラーコードも↑同様で枠線の色を変えられます
　　　　↑[5px]は枠線の太さ、数字が大きいほど枠線が太くなります
[background-color:#ffffff;]の#ffffffのカラーコードを変更すると背景の色を変えられます
[li type="記号の種類"]は[disc(塗りつぶし円)][circle(中抜き円)][square(塗りつぶし四角)]

<div style="font-size:14px;color:#ffffff;
width:230;border:5px ridge #950000;background-color:#009500;padding:10px;margin:auto;">
<ul style="margin:0px 0px 0px 15px;text-align:left;">
<li type="disc">項目１
<li type="disc">項目２
<li type="disc">項目３
<li type="disc">項目４
<li type="disc">項目５
</ul></div>

装飾リスト３(和風)

項目１
項目２
項目３
項目４
項目５

[font-size:14px;]は文字の大きさ、数字の大小で文字の大きさを変えられます
[width="230"]は横の範囲の長さ、数字を増やすと横に長くなります
[color:#000000;]の#000000のカラーコードを変更すると文字の色を変えられます
[border:5px solid #7a7a45;]のカラーコードも↑同様で枠線の色を変えられます
　　　　↑[5px]は枠線の太さ、数字が大きいほど枠線が太くなります
[background-color:#d1d1ad;]の#d1d1adのカラーコードを変更すると背景の色を変えられます
[li type="記号の種類"]は[disc(塗りつぶし円)][circle(中抜き円)][square(塗りつぶし四角)]

<div style="font-size:14px;color:#ffffff;
width:230;border:5px ridge #950000;background-color:#009500;padding:10px;margin:auto;">
<ul style="margin:0px 0px 0px 15px;text-align:left;">
<li type="disc">項目１
<li type="disc">項目２
<li type="disc">項目３
<li type="disc">項目４
<li type="disc">項目５
</ul></div>

バラエティリスト４(大きめのリスト)

項目１
項目２
項目３
項目４
項目５

[font-size:20px;]は文字の大きさ、数字の大小で文字の大きさを変えられます
[width="500"]は横の範囲の長さ、数字を増やすと横に長くなります
[color:#0080ff;]の#0080ffのカラーコードを変更すると文字の色を変えられます
[border:15px solid #0080ff;]のカラーコードも↑同様で枠線の色を変えられます
　　　　↑[15px]は枠線の太さ、数字が大きいほど枠線が太くなります
[background-color:#ffffff;]の#ffffffのカラーコードを変更すると背景の色を変えられます
[li type="記号の種類"]は[disc(塗りつぶし円)][circle(中抜き円)][square(塗りつぶし四角)]

<div style="font-size:20px;color:#0080ff;
width:500;border:15px double #0080ff;background-color:#ffffff;padding:10px;margin:auto;">
<ul style="margin:0px 0px 0px 15px;text-align:left;">
<li type="disc">項目１
<li type="disc">項目２
<li type="disc">項目３
<li type="disc">項目４
<li type="disc">項目５
</ul></div>

バラエティリスト５(小さめのリスト)

項目１
項目２
項目３
項目４
項目５

[font-size:10px;]は文字の大きさ、数字の大小で文字の大きさを変えられます
[width="100"]は横の範囲の長さ、数字を増やすと横に長くなります
[color:#0080ff;]の#0080ffのカラーコードを変更すると文字の色を変えられます
[border:1px solid #0080ff;]のカラーコードも↑同様で枠線の色を変えられます
　　　　↑[1px]は枠線の太さ、数字が大きいほど枠線が太くなります
[background-color:#ffffff;]の#ffffffのカラーコードを変更すると背景の色を変えられます
[li type="記号の種類"]は[disc(塗りつぶし円)][circle(中抜き円)][square(塗りつぶし四角)]

<div style="font-size:10px;color:#0080ff;
width:100;border:1px solid #0080ff;background-color:#ffffff;padding:10px;margin:auto;">
<ul style="margin:0px 0px 0px 15px;text-align:left;">
<li type="disc">項目１
<li type="disc">項目２
<li type="disc">項目３
<li type="disc">項目４
<li type="disc">項目５
</ul></div>

ページトップへ

文章の無断転載・タグサンプルの再配布を禁止します。
Copyright © 2005-2006 hide. All Rights Reserved.
全ページリンクフリーです。