2006年06月25日

新着記事リストをきれいに並べるには

久しぶりにHTML付きのカスタマイズネタです。といっても過去のカスタマイズの補足ですから新鮮さはありませんが^^;

このブログには目次の欄に新着記事一覧を表示していますが、これをきれいに並べて表示するにはどうしたらいいのか。先日コメントでご質問いただきましたのでお答えいたします。
特に難しい事はありません。私の場合はリストタグを使っています。

<IndexArticlesLoop>
<ul>
<li><a href="<$ArticlePermalink$>"><$ArticleTitle ESCAPE$></a>(<$ArticleDate$>)
</ul>
</IndexArticlesLoop>


全体を<ul>タグでくくって、記事タイトルをを<li><でくくるだけです。こうすると比較的簡単にちょうどいいくらいの間隔で記事タイトルを一覧化することが出来ます。

また、リストの体裁を更に調整したいならCSSを追加します。
#ul {
font-size : 12px;
font-weight : normal;
line-height : 150%;
color : gray;
padding-left : 10px;
list-style-type : none;
}
フォントのサイズや色、リストマークを消したりしています。list-style-type : none;の部分がリストマークを消す記述ですから、この行を消すと記事タイトルの前にポッチが付きます。
人気ブログランキング。目指せトップ10入り!人気ブログランキング


Posted by hammer77 at 01:20│Comments(4)TrackBack(0)Edit

この記事へのトラックバックURL

トラックバックありがとうございます。トラックバックスパム対策の為、この記事へトラックバックするにはそちらの記事内にこの記事へのリンク(参照リンク)が必要になります。不本意ではございますが、ご理解ほどよろしくお願いいたします。(トラックバックポリシー)
http://trackback.blogsys.jp/livedoor/hammer77/50564291
この記事へのコメント
はじめまして。
ランキングから来ました。
ちぇこ♪と申します。
ブログ す・す・すごいですね。
いっろんな情報が!
また、ちょくちょく来ますね。
勉強しに!
それでは、応援ポチッ!
Posted by ちぇこ♪ at 2006年06月28日 22:17
いつもひそかに勉強させてもらっています!
Posted by ichi at 2006年06月29日 19:35
ちぇこさん、ichiさん、コメントありがとうございます。ほったらかしにしてすみません^^;
記事の量は多いですが、古い記事ばかりなので恐縮です。
Posted by hammer at 2006年07月12日 00:26
I’ve been surfing online more than three hours today, yet I never found any interesting article like yours. It is pretty worth enough for me. In my view, if all website owners and bloggers made good content as you did, the internet will be a lot more useful than ever before.
Posted by Alexis at 2014年01月22日 23:04
コメントお待ちしています。こちらではコメント認証もコメント保留も行っておりません。お気軽にコメントください^^