blue×gray(rss ver.)

このデザインについて

CMYKRGB サンプル
カテゴリー:シンプルベーステーマ:hatenaヘッダー:グレー(細)
登録日:2008/04/29更新日:2008/04/29利用数:98
blue×grayにサイドバーではてなブックマークの人気エントリーリストを追加したバージョンです。

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

ページのヘッダ

<table width="90% padding="0" align="center">
<tr>
<td width="20%"><B> :: menu :: </b></td>
<td width="20%"><a href="http://www.hatena.ne.jp/"> :: はてな :: </a></td>
<td width="20%"><a href="http://d.hatena.ne.jp/"> :: はてなダイアリー :: </a></td>
<td width="20%"><a href="http://b.hatena.ne.jp/"> :: はてなブックマーク :: </a></td>
<td width="20%"><a href="http://f.hatena.ne.jp/"> :: はてなフォトライフ :: </a></td>
</tr>
</table>
<h1><hatena name="title "color="lg"></h1>
<div class="main">

ページのフッタ

</div>
<div class="sidebar">
<hatena name="rss" url="http://b.hatena.ne.jp/hotentry?mode=rss" moduletitle="Hotentry" template="hatena-module" titlelength="60" listlimit="80">
</div>

スタイルシート

body{
	font-size:9pt;
	font-style:normal;
	line-height:150%;
	color: #696969;
	background-color: #ffffff;
	margin: 0px 0px;
}

div.main{
 	width:80%;
	float:left;
	margin:0;
}

h1{
        margin: 50px 10px 10px 10px;
        color: #003366;
    font-size: 18px;
}
	A:link {color:#003366}
	A:visited {color:#696969}
	A:active {color:#cccccc}
	A:hover {color:ADD8E6}
	A:link,A:visited,A:active,A:hover {text-decoration:none}
	A:link,A:visited,A:active,A:hover {font-style:normal}
	A:link,A:visited,A:active,A:hover {font-size:9pt}

body{
	scrollbar-face-color:#ffffff; 
	scrollbar-highlight-color:#003366;
    scrollbar-shadow-color: #ffffff; 
	scrollbar-3dlight-color: #ffffff; 
	scrollbar-arrow-color: #003366;
    scrollbar-track-color: #ffffff; 
	scrollbar-darkshadow-color: #003366;
    scrollbar-width: 30;
}
p{
	color: #696969;
	font-size: 9pt;
	font-style: normal;
	line-height:150%;
	margin: 0px 0px;
}

.diff {
	font-size: 70%;
	background:#F0F8FF;
	border:1px dashed #ADD8E6 ;
	margin-left:140px;
 	padding:10px;
}

.sidebar{
 	width:20%;
 	float:right;
 	margin:0;
 	padding-bottom:7px;
 	background-color:#F0F8FF;
 	border-top:solid 0px #cccccc;
 	border-bottom:solid 0px #cccccc;
 	font-size:8pt;
 	color:#696969;
 	text-align:left;
}


.hatena-module{ margin:2px 7px 5px 7px; }
.hatena-moduletitle{
 	margin-top:10px;
 	padding:13px 12px 15px 0;
 	text-align:left;
 	font-size:18px;
 	font-weight:normal;
 	color:#003366;
 	line-height:100%;
 	background-color:#F0F8FF;
}

.hatena-modulebody{
 	padding:0px 7px 10px 7px; 
 	font-size: 8pt;
 	background-color:#F0F8FF;
	border:1px dashed #ADD8E6 ;

}


.sidebar a{color:#696969; }
.sidebar li a{ margin:0; padding:2px; color:#696969; }
.sidebar li a:hover{ color:#ADD8E6; }
.hatena-moduletitle a{ color:#003366; }


.sidebar li{ color:#696969; }
.sidebar ul{ margin:0; padding:0; list-style-type:none; }
.hatena-module li,
.sidebar dd{ margin-bottom:0.5em; padding-bottom:0.5em; border-bottom:dotted 1px #cccccc;  }
.hatena-hotstar img{ display:none }
img.bcounter{ margin:3px 7px 2px 7px }