CSSコードを使用して、箇条書きをHTMLに揃えます。
Webデザイナーは、箇条書きとテキストを追加するだけでなく、箇条書きを使用します。 箇条書きの作成に使用されるHTMLタグは、スライドショーにロードするJavaScriptのメニューを作成したり画像を整理したりするのに便利です。 カスケードスタイルシートコードを箇条書き（HTMLスラングでは「順序付けられていないリスト」と呼ばれる）と組み合わせて使用する方法を学ぶことで、いくつかのエキサイティングなWebデザインの可能性が開かれます。
ステップ1
箇条書きを含むHTMLファイルを開き、コードの上部にあるタグとタグの間を確認します。 タグがまだ存在しない場合は追加します。 コードに タグの後のどこかにタグを付ける、そしてそれ CSSファイルへの参照が含まれている場合は、代わりにそのファイルを開きます。 CSSコードは、タグ間またはCSSファイルの新しい行に配置されます。
今日のビデオ
ステップ2
「text-align」を設定して、すべての箇条書き内のテキストを揃えます
- 鬼ごっこ。 The
- と タグを使用して、それらを単一のリストの一部として定義します。 のテキストを揃えるとき
- タグがラップアラウンド
- タグを使用すると、配置はすべての箇条書きのテキストに影響しますが、リスト自体はページの左または右に配置されません。 「text-align」を設定するCSSコードの例を次に示します。
ul {text-align：right;}
箇条書きはテキストと一緒に移動しないことに注意してください。 この場合、弾丸は左側に留まります。
ステップ3
「float」を設定して、リスト全体をページの左または右に揃えます。
- 鬼ごっこ。 「float」が左または右に設定されている場合
- タグを付けると、箇条書き全体がページの左または右に移動します。 フロートを次のように設定します。
ul {float：right;}
「フロート」は左または右に設定できますが、中央には設定できません。
ステップ4
あなたを包む
- のタグ
と
タグを使用して、箇条書きをページの中央に配置するラッパーを作成します。 結果のコードは次のようになります。- リストアイテム
- リストアイテム
The
タグ自体は何も中央に配置しません。 CSSを使用してすべてを中央に配置する必要があります。 次のコードを
