リストを表示する(右寄せ)
リストを右寄せに表示する方法です。
リスト全体の表示位置を、右寄せにする事が可能になります。右端を揃えたい場合に有効です。
sample
- 項目1行目
- 項目2行目
HTML
リストを右寄せに表示するにはスタイルシートにて行います。
ホームページ作成TOP > リスト > リストを表示する(右寄せ) > このページのTOP ▲
スタイルシート text-align:right
リストをスタイルシートで右寄せに表示するには、リスト自体の<ul>や<ol>
に対してtext-align:right
を適用します。
要素に直接書く
書き方は
<ul style="text-align:right">
<li>項目1行目</li>
<li>項目2行目</li>
</ul>
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 { text-align:right;}
-->
</style>
</head>
<body>
<ul>
<li>項目1行目</li>
<li>項目2行目</li>
</ul>
</body>
</html>
こうなります
ホームページ作成TOP > リスト > リストを表示する(右寄せ) > このページのTOP ▲
スポンサードリンク
無料メール情報誌
ワンランクUP講座
ホームページのスタイルをワンランクアップ!基本調整や特選方法、さらにはインターネットの話題までメールマガジンでお届けします。
サイト内検索
おすすめ1冊
全体レイアウトを実際のサイト事例を使用し、詳細までを解説。
スタイルシートの使い方のバリエーションを知る事ができる1冊。
スタイルシートの使い方のバリエーションを知る事ができる1冊。
おすすめソフト
Webデザインに最適な新しいインタフェイスを備え、Webグラフィックをより簡単・効率的に制作することができます。
検証結果