カスタマイズいろいろ
これまでのソースにHTMLやスタイルシートを加えてカスタマイズする方法を4つご紹介いたします。
- 右寄せで表示（下記）
- センタリングで表示（下記）
- ページ番号群の左側に文字を加える（後半）
- ページ番号の文字サイズを大きくする（後半）
■右寄せ
右寄せで表示させたい場合は、ul要素に対してfloatプロパティに値「right」を加えます。
ul.pagelinks {
float: right;
}
float: right;
}
すると、以下のように右寄せで表示されます。
■センタリング
センタリングして表示させたい場合は、ul要素に対してmarginプロパティの値に「auto」を加え、widthプロパティで全体の横幅を指定します。
ul.pagelinks {
margin: auto;
width: 8em;
}
margin: auto;
width: 8em;
}
これだけだと、一部のブラウザでセンタリングされないので、ul要素の外側にdiv要素を配置して、以下のように記述します。
<div style="text-align: center;">
<ul class="pagelinks"> ～ </ul>
</div>
<ul class="pagelinks"> ～ </ul>
</div>
これで、以下のようにセンタリングして表示されます。
次のページでは、リンク群の左隣に文字を表示させたり、リンクの文字サイズを大きくしたりする方法をご紹介致します。
