Ocean Note

このデザインについて

Ocean Noteico01 サンプル
カテゴリー:季節ベーステーマ:なしヘッダー:白(太)
登録日:2007/05/09更新日:2007/05/09利用数:155
空き容量429MB - 「画像の使用を(略)CSS大会」用CSSをもうひとつ
http://d.hatena.ne.jp/ico01/20070507/p1

上記デザインを元に作成しました。

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

ページのヘッダ

<h1><hatena name="title"></h1>

ページのフッタ


スタイルシート

*{
	margin:0;
	padding:0;
	zoom:1;
}


/* --------------------
	全体    
-------------------- */
body{
	position:absolute;
	top:0;
	right:20px;
	width:590px;
	overflow-x:hidden;
	border-right:solid 3px #2B5782;
	border-left:solid 3px #2B5782;
	background-color:#336699;
	font-size:95%;
	color:#3B3C3D;
}
div.hatena-body{
	background-color:#FFFFFF;
}


/* --------------------
	h1 , pager   
-------------------- */
h1{
	position:absolute;
	top:0;
	right:620px;
	width:1em;
	overflow:hidden;
	color:#2B5782;
	text-align:center;
	font-size:780%;
	line-height:1em;
}
.feed-icon{
	display:none;
}

.pager{
	padding:5px 1em 0.25px 0;
	font-size:85%;
	text-align:right;
	letter-spacing:2px;
}
#pager_top{
	padding-top:0.5em;
}
#pager_top b,
#pager_bottom b{
	padding:0.5em;
}
#pager_top b,
#pager_bottom b{
	background-color:#FBF6F6;
}
.pager a:link{
	color:#3B3C3D;
}
.pager a:visited{
	color:#9E9E9F;
}


/* --------------------
	ol内 
-------------------- */
ol{
	padding:0.5em 1em;
	list-style-type:none;
}
.modified{
	margin-left:-2em;
	padding:2px 0;
	width:12em;
	display:block;
	background-color:#FCFCDF;
	border-top:solid 1px #D9D9D9;
	border-right:solid 1px #D9D9D9;
	border-bottom:solid 1px #D9D9D9;
	border-left:solid 10px #993333;
	color:#3E3E30;
	font-family:Georgia,serif;
	text-align:center;
}
ol li a:link{
	border-bottom:solid 2px #CECECE;
	color:#3B3C3D;
	text-decoration:none;
}
ol li a:visited{
	border-bottom:solid 2px #CECECE;
	color:#9E9E9F;
	text-decoration:none;
}

#hatena-antenna-normal .modified,
#hatena-antenna-detail .modified{
	margin-top:2em;
	margin-bottom:0.55em;
}
.diff{
	margin-top:0.55em;
	padding-left:5px;
	border-left:solid 10px #F5EBEB;
	font-size:90%;
	text-align: justify;
	text-justify: inter-ideograph;
	line-height:1.55;
}

#hatena-antenna-simple ol li{
	margin:10px 0;
	line-height:1.45;
}
#hatena-antenna-simple .modified{
	padding:2px 5px;
	display:inline;
}

#hatena-antenna-image .modified{
	margin-left:0;
	width:12.5em;
}


/* --------------------
	footer   
-------------------- */
.footer{
	padding:1em 0;
	color:#9E9E9F;
	text-align:center;
	font-size:83%;
}


/* --------------------
	IE6用   
-------------------- */
div.hatena-body{
	_position:absolute;
	_right:20px;
	_top:60px;
	_width:590px;
	_border-right:solid 3px #2B5782;
	_border-left:solid 3px #2B5782;
	_background-color:#FFFFFF;
}
#banner{
	_position:absolute;
	_right:20px;
	_width:590px;
	_border-right:solid 3px #2B5782;
	_border-left:solid 3px #2B5782;
}
h1{
	_position:absolute;
	_top:-60px;
}
.modified{
	_margin-left:0;
}


div.message{
	position:fixed;
	bottom:0;
}