tureusaのデザイン:ライトグレー

このデザインについて

tureusa サンプル
カテゴリー:シンプルベーステーマ:なしヘッダー:ライトグレー(太)
登録日:2006/11/08更新日:2006/11/09利用数:73
ライトグレーのヘッダに合わせたデザインです。いろんなヘッダ色に応用できるかと。

ヘッダの<p class="free">〜</p>の中はフリースペースなので、アンテナの説明などご自由に。必要なければ消しちゃってください。(フッタに入れても良いかと。)

ヘッダ/フッタ/スタイルシート

ページのヘッダ

<h1><hatena name="title" color="wh"></h1>
<p class="free">
フリースペースです。アンテナの説明などご自由に。リンクはこうなるヨ→<a href="http://www.hatena.ne.jp/">はてな</a>
</p>

ページのフッタ


スタイルシート

body {
 margin:0px;padding:0px;
 text-align:left;
 font-family:Arial,sans-serif;
 font-size:100%;
 background-color:#B9B8B4;
 color:#666666;
 letter-spacing:1px;
}

a {
 color:#666666;
}

a:hover {
 color:#8F8E89;
}

div.hatena-body {
 margin:0px auto;
 padding:0px 0px 5px 0px;
}

h1 {
 margin:5px 0px;
 padding-right:7px;
 font-size:120%;
 letter-spacing:5px;
 text-align:right;
 color:#ffffff;
}

/* Free Space */

p.free {
 margin:0px;
 padding:3px 0px 3px 7px;
 background-color:#D8D8D5;
 color:#8F8E89;
 font-size:80%;
 border-top:1px solid #989793;
 border-bottom:1px solid #989793;
}

p.pager {
 margin:7px 0px 0px 0px;
 padding:0px 1em;
 font-size:70%;
 color:#ffffff;
}

p.pager a:hover {
 color:#ffffff;
}

#pager_top,#pager_bottom {
 text-align:right;
}

ol {
 color:#666666;
}

li {
 margin:0px 0px 10px 0px;
 padding:3px 0px 0px 0px;
 background-color:#D8D8D5;
 color:#ffffff;
 font-size:80%;
 border-top:1px solid #989793;
}

a.screenshot img {
 border:1px solid #ffffff !important;
}

/* Update Day */

li span.modified {
 text-indent:7px;
 color:#8F8E89;
}

/* Author */

li span.author {
 color:#8F8E89;
}

/* Update Contents */

p.diff {
 margin:3px 0px 0px 0px;
 padding:7px 7px 0px 0px;
 background-color:#B9B8B4;
 border-top:1px solid #989793;
 color:#fffffff;
}

p.diff img {
 border:1px solid #ffffff;
 margin-right:1em;
}

div.footer {
 color:#999999;
 font-size:80%;
 text-align:center;
}

#toggle_visited {
 margin:5px 7px 0px 0px;
 padding:0px;
}

#navi_toggle {
 color:#8F8E89;
 width:100px;
}