ホームページ作成TOP > リスト > リストのマークを変更する(ローマ数字にする)
リストのマークを変更する(ローマ数字にする)
箇条書等に使用されるリストの『マーク』を、ローマ数字に一括して変更する方法です。
各指定方法の全体は、リストのマークを変更する(全体)に一覧がありますので参照願います。
sample
- 項目1行目
- 項目2行目
HTML <ol type="種類">〜</ol>
リストマークを、ローマ数字にて表現するには、数字リスト全体の<ol>
にtype="種類"
を設定する事で、そのリスト全体がローマ数字に変更されます。
(ちなみに<ul>
にtype="種類"
を設定しても同様の結果になるブラウザが多いです)
表示 | 種類 | 書き方 |
---|---|---|
アルファベット数字(小文字) | <ol type="a">〜</ol> | |
アルファベット数字(大文字) | <ol type="a">〜</ol> |
書き方は
<ol type="i">
<li>項目1行目</li>
<li>項目2行目</li>
</ol>
こうなります
ホームページ作成TOP > リスト > リストのマークを変更する(ローマ数字にする) > このページのTOP ▲
スタイルシート list-style:種類
リストのマークをスタイルシートにてローマ数字に変更するには、全体を表す<ul>
にlist-style:種類
を設定する事で、そのリスト全体のマークが変更されます。
スタイルシートの場合の種類は下記の様になります。
表示 | 種類 | 書き方 |
---|---|---|
ローマ数字(小文字) | list-style:lower-roman | |
ローマ数字(大文字) | list-style:upper-roman |
要素に直接書く
書き方は
<ul style="list-style:lower-roman">
<li>項目1行目</li>
<li>項目2行目</li>
</ul>
ホームページ作成TOP > リスト > リストのマークを変更する(ローマ数字にする) > このページのTOP ▲
headに書く
書き方は
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
<!--
ul { list-style:lower-roman;}
-->
</style>
</head>
<body>
<ul>
<li>項目1行目</li>
<li>項目2行目</li>
</ul>
</body>
</html>
こうなります
ホームページ作成TOP > リスト > リストのマークを変更する(ローマ数字にする) > このページのTOP ▲
スポンサードリンク
無料メール情報誌
ワンランクUP講座
ホームページのスタイルをワンランクアップ!基本調整や特選方法、さらにはインターネットの話題までメールマガジンでお届けします。
サイト内検索
おすすめ1冊
全体レイアウトを実際のサイト事例を使用し、詳細までを解説。
スタイルシートの使い方のバリエーションを知る事ができる1冊。
スタイルシートの使い方のバリエーションを知る事ができる1冊。
おすすめソフト
Webデザインに最適な新しいインタフェイスを備え、Webグラフィックをより簡単・効率的に制作することができます。
検証結果