無料ブログ作成ならJUGEM(ジュゲム)

ホーム

テンプレートHTML・CSSについて: 公開されているテンプレートのHTMLに{ad}タグがないものありますので、エラーが表示された場合は{ad}タグを追加してご利用ください。
テンプレートの利用について: 弊社が著作権を所有する画像等以外のテンプレートに関する著作権は制作者にあります。弊社提供以外のブログサービスで利用した場合は、その都度制作者の方にご確認ください。

テンプレート名 : 小窓風＊シンプルモノクロ

HTML・CSSをコピーして使う

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
	<head>

</head>

<div id="titlebar" class="black">
				<h1>{blog_name}</h1>
			</div>

<div id="globalnavi" class="black">

<ul><li>{blog_description}</li></ul>

</div>

</div></div>

{toponly_dmy}

<h2>ごあんない</h2>

<div id="updatelog" class="white">
	<p>2013/09/14　　ブログ立ち上げ</p>
</div>

<h2>プロフィール</h2>

<h1>{entry_title}</h1>
			<div class="date">
			{category_name} ＊
			{entry_year}/{entry_month}/{entry_day}({entry_eng_week_short}) {entry_time}
			</div>
			{entry_description}

</div></div>

<h1>MENU</h1>

<h2>CATEGORY</h2>
				
				{category_list}

<h2>LATEST ENTRY</h2>
				
				{latest_entry_list}

<h2>ADS</h2>
				{ad}

</div></div>

<ul>
				<li><a href="http://jugem.jp/">jugem.jp</a>
				<li>Copyright &copy; 2013 chako</li>
				<li><a href="http://www.w-frontier.com/" title="高機能HTML/XHTML/スタイルシート対応エディタ(Web Frontier)" target="_blank">Created by ez-HTML</a></li>
			</ul>

</div></div>

</div></body>
</html>

CSS

/*
******************************
          Simple ＊ Monochrome
             designed by chako
    http://chakomemo.jugem.jp/
       last updated 2013/10/19
******************************
*/

@charset "{site_encoding}";

*
{
	margin:		0px;
	padding:	0px;
}

/* 全体の色とフォント */
body
{
	font-family:	Verdana, sans-serif;
	font-size:		x-small;
	overflow:		auto;
}
body.black, div.black
{
	background-color:	#000000;
	color:				#FFFFFF;
}
body.white, div.white
{
	background-color:	#FFFFFF;
	color:				#000000;
}
div.black a:link, div.black a:visited
{
	color: 				#FFFFFF;
}
div.black a:hover, div.black a:active
{
	background-color:	#FFFFFF;
	color: 				#000000;
}
div.white a:link, div.white a:visited
{
	color: 				#000000;
}
div.white a:hover, div.white a:active
{
	background-color:	#000000;
	color: 				#FFFFFF;
}

/* 大枠のスタイル */
/* positionはなるべくstaticで */
div#wrapper
{
	width:		800px;
	height:		600px;
	margin:		-300px 0 0 -400px;
	padding:	0px;
	border:		1px solid #000000;
	position:	absolute;
	top:		50%;
	left:		50%;
	overflow:	auto;
}
div#headerbox
{
	width:		800px;
	height:		70px;
	margin:		0px;
	padding:	0px;
	border:		none;
	position:	static;
	overflow:	hidden;
}
div#sidemenubox
{
	width:		200px;
	height:		480px;
	margin:		0px;
	padding:	0px;
	border:		none;
	position:	static;
	float:		left;
	overflow:	auto;
}
div#mainbox
{
	width:		600px;
	height:		480px;
	margin:		0px;
	padding:	0px;
	border:		none;
	position:	static;
	float:		right;
	overflow:	auto;
}
div#footerbox
{
	width:		800px;
	height:		50px;
	margin:		0px;
	padding:	0px;
	border:		none;
	position:	static;
	clear:		both;
	overflow:	hidden;
}

/* header用のスタイル */
div#header
{
	width:		788px;	/*800-mg10-bd2*/
	height:		58px;	/*70-mg10-bd2*/
	margin:		5px;
	padding:	0px;
	border:		1px dashed #FFFFFF;
	position:	static;
	overflow:	hidden;
}
div#titlebar
{
	width:		788px;
	height:		40px;
	margin:		0px;
	padding:	0px;
	border:		none;
	position:	static;
	overflow:	hidden;
}
div#globalnavi
{
	width:		788px;
	height:		18px;	/*58-40*/
	margin:		0px;
	padding:	0px;
	border:		none;
	position:	static;
	overflow:	hidden;
}
div#titlebar h1
{
	font-size:		x-large;
	letter-spacing:	0.6em;
	line-height:	40px;
	
	margin:		0 0 0 20px;
}

div#titlebar a { text-decoration: none; }

div#globalnavi ul
{
	list-style-type:	none;
	font-size:			small;
	
	margin:		0 20px 2px 0;
}
div#globalnavi li
{
	float:		right;
	margin:		0 0 0 1em;
}
div#globalnavi li:before{content:"＊";}

/*footer用のスタイル*/
div#footer
{
	width:		788px;	/*800-mg10-bd2*/
	height:		38px;	/*50-mg10-bd2*/
	margin:		5px;
	padding:	0px;
	border:		1px dashed #FFFFFF;
	position:	static;
	overflow:	hidden;
}
div#footer ul
{
	list-style-type:	none;
	
	margin:		2px 20px 0 0;
}
div#footer li
{
	float:		right;
	margin:		0 0 0 1em;
}
div#footer li:before{content:"＊";}

/* sidemenu用のスタイル */
div#sidemenu
{
	margin:		0px;
	padding:	10px;
	border:		none;
	position:	static;
	overflow:	auto;
}
div#sidemenu h1
{
	border:			1px dashed #FFFFFF;
	text-align:		center;
	line-height:	35px;
}
div#sidemenu h2
{
	border-bottom:	1px dashed #FFFFFF;
	margin:			1em 0 1em 0;
}
div#sidemenu h2:before, div#sidemenu h2:after{content:"＊";}

div#sidemenu li
{
	margin:		0 0 0 1.5em;
}

/* 記事部分のスタイル */
div#main
{
	padding:	10px;
}
div#main p
{
	margin:		0 0 1em 1em;
}
/* 見出し */
div#main h1:before, div#main h1:after{content:"＊";}

div#main h2:before, div#main h2:after{content:"＊";}

div#main h3:before{content:"＊";}

div#main h1
{
	border:			1px dashed #000000;
	text-align:		center;
	line-height:	35px;
	margin:			1em 0 1em 0;
}
div#main h2
{
	border-bottom:	1px dashed #000000;
	margin:			2em 0 1em 0;
}
div#main h2:first-child
{
	margin:			1em 0 1em 0;
}
div#main h3
{
	margin:			2em 0 1em 0;
}
div#main h4
{
	margin:			2em 0 1em 0.5em;
}
/* リスト */
div#main dl
{
	margin:			1em 0 1em 1em;
}
div#main dt
{
	font-weight:	bold;
}
div#main dd
{
	margin:			0 0 1em 1em;
}
div#main ul
{
	margin:			1em 0 1em 1em;
}
div#main ol
{
	margin:			1em 0 1em 1em;
}
div#main li
{
	margin:			0 0 1em 1em;
}
/* 日付カテゴリ行 */
div.date
{
	text-align:		right;
}
/* TOPリンク行 */
div.back
{
	font-weight:	bold;
	font-size:		small;
	text-align:		right;
	margin:		2em 0 10em 0;
	border-top:	1px dashed #000000;
}
div.back:before, div.back:after{content:"＊";}

/* ミニBOX */
div#updatelog
{
	width:		400px;
	height:		50px;
	margin:		1em;
	padding:	1em;
	border:		1px solid #000000;
	position:	static;
	overflow:	auto;
}
div#updatelog p
{
	margin:	0 0 0.5em 0;
}
/* その他 */
span.new
{
	color:			#FF0000;
	font-weight:	bold;
}
span.new:before{content:" ←New!!";}

高品質デザイン選び放題で、あなた好みのブログに。今すぐブログ作成！: 今すぐ 無料ブログ をはじめよう！ ≫ブログ作成