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

ホーム

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

テンプレート名 : spiro071028

HTML・CSSをコピーして使う

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
	<meta http-equiv="Content-Type" content="text/html;  charset={site_encoding}" />
	<meta http-equiv="Content-Script-Type" content="text/javascript" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta name="verify-v1" content="Zdrakma8qcrjIFOGOgm2yH6+fpl7Xw9I/8anuRApo2E=" />
	<meta name="viewport" content="width=800" /> 
	<meta name="copyright" content="copyright (c) Yoshinori Shiraki" />
	<title>{site_title}</title>
	<meta name="description" content="呼吸運動記録器ブログ。日々呼吸し、運動して、記録する。" />
	<meta name="keywords" content="spirograph,spiro,呼吸運動記録器,スピロ,メガネ,megane,背中痒太郎,スピログラフ" />
	<link rel="stylesheet" href="{site_css}" type="text/css" />
	<link rel="alternate" type="application/rss+xml" title="RSS" href="utf-8" />
	<link rel="alternate" type="application/atom+xml" href="http://feeds.feedburner.jp/spirograph" />
	<link rel="alternate" media="handheld" type="application/xhtml+xml" href="{mobile_url}" />
	<link rel="shortcut icon" href="http://spirograph.sub.jp/blog/spirograph.ico" />
	<script type="text/javascript" src="./template/js/cookie.js"></script>
	<script type="text/javascript" src="http://spirograph.sub.jp/blog/js/module.js"></script>

</head>
<body onload="javascript:initval();">
<div id="wrapper">

<div id="header">

<h1><a href="http://spiro-graph.jugem.jp/">spirograph -スピログラフ-</a></h1>
<div class="description">{blog_description}</div>

<div class="sequel">
 {prev_entry} | <a href="./">BLOG TOP</a> | {next_entry} 
</div>

</div>

<div style="padding:0 45px">
<div id="entry">

<hr />
<h2 class="t_entry"><a href="{entry_permalink}">{entry_title}</a></h2>
<div class="body">
{entry_description}
</div>
<div class="date">| POSTED: {entry_year}/{entry_month}/{entry_day}({entry_eng_week_short}) {entry_time} | {comment_num} | category: {category_name} | {user_name} | <script src="http://flower.mochivation.com/?url={entry_permalink}" type="text/javascript" charset="utf-8"></script></div>

<a name="comments"></a>

<div class="title">comment</div>

<div class="body">
{comment_description}
</div>
<div class="state">
| {comment_name} | {comment_time} |
</div>

<div class="body">
<form name="comment_area" id="comment_area" action="./?mode=comment" method="post">
<input type="hidden" name="entry_id" value="{entry_id}" />
<label for="name">name:</label><br/>
<input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" /><br />
<label for="email">email:</label><br>
<input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" /><br />
<label for="url">url:</label><br>
<input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" /><br />
<label for="description">comments:</label><br />
<textarea tabindex="4" id="description" name="description" style="width:450px;height:100px"></textarea><br />
<br />
<input tabindex="5" type="submit" value="コメント送信" onclick="javascript:setval();" />
<input type="checkbox" name="set_cookie" value="1" id="set_cookie">
<label for="set_cookie">Cookieに登録</label>
</form>
</div>

</div>

<hr />

<div id="sidebar">

<div class="ti_entries">
	entries
	</div>
	<div class="list">
	{latest_entry_list}
	</div>

<div class="ti_archives">
	archives
	</div>
	<div class="list">
	{archives_list}
	</div>

<div class="ti_categories">
	categories
	</div>
	<div class="list">
	{category_list}
	</div>

<br />

<script type="text/javascript" src="http://widget.booklog.jp/blogparts/js/booklog_minishelf_4col.js?handwrite" id="booklog_minishelf_4col"></script>
<script type="text/javascript" src="http://api.booklog.jp/json/meganekids?category=0&count=12&callback=booklog_minishelf_4col"></script>
<br />

<div class="ti_links">
	links
	</div>
	<div class="list">
	{link_list}
	</div>

<div class="feed">
	<ul>
	<li><a href="http://feeds.feedburner.jp/spirograph">RSS</a></li>
	</ul>
	</div>

<div class="ad"">
	{ad}
	</div> 

<div class="jugembnr">
<a href="https://jugem.jp/"><img src="http://img-cdn.jg.jugem.jp/07b/423685/20080123_213202.gif" alt="" width="150" height="104" /></a>
</div>
</div>
</div>
<br class="clear" />

<div class="navi">
	{prev_page_link}&nbsp; |{page_now}/{page_num}| &nbsp;{next_page_link}
</div>

<div class="copyright">
{copyright}<br />
</div>

</div>

</div>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-2840715-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>

<script type="text/javascript" src="http://www.assoc-amazon.jp/s/impression-counter?tag=spirograph0e-22&o=9"></script>
<noscript><img src="http://www.assoc-amazon.jp/s/noscript?tag=spirograph0e-22" alt="" /></noscript>

</body>
</html>

CSS

/* ------------------------------------------
 Spirograph（spiro-graph.jugem.jp)
 by shiraki
------------------------------------------ */

/* ------------------------------------------
 初期化
------------------------------------------ */
body,
div,form,
h1,h2,h3,h4,h5,h6,p,address,
dl,dt,dd,ul,ol,li,
img,object,embed,blockquote {
	margin:0;	padding:0;
	line-height:1.4em;
	font-size:100%;
	border:none;
}
h1,h2,h3,h4,h5,h6,dt,
strong,em {
	font-weight:bold;
	font-style:normal;
}
li {
	list-style:none;
}

/* ------------------------------------------
 タグ再定義
------------------------------------------ */

body {
	background:#c6c6b9;
	}

a {color:#f88ba7; text-decoration:none;}
a:link {color:#f88ba7; text-decoration:none;}
a:visited {color:#f88ba7; text-decoration:none;}
a:active {color:#f88ba7; text-decoration:underline;}
a:hover {color:#808080; text-decoration:none; background-color:#e7e7e7;}

h1 {
	margin-left:45px;
	text-indent: -9999px;
}

h1 a{
	display:block;
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20090715_450342.gif) no-repeat ;
	width:292px;
	height:47px;
}

h2 {
	margin:0 0 20px 0;
	font-family:Georgia, Sans-Serif;
	font-size:22px;
	font-weight: bolder;
	color: #000;
}

.t_entry a,a:link,a:visited,a:active{
	color: #f88ba7;
	text-decoration:underline;
}

.t_entry a:hover{
	color: #f88ba7;
	text-decoration:none;
}

img.pict,div.pict {
	padding:3px;
	border:1px solid #441f00;
}

a:hover img.pict{opacity:0.7}

input, textarea {
	border:1px solid #666;

}

blockquote {
	margin: 10px;
	padding: 10px;
	border: 2px solid #CCC;
	font-family: "Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	font-size: 11px;
	color: #808080;
	}

pre {
	padding: 10px;
	border: 2px solid #CCC;
	background-color: #e7e7e7;
	font-size: 11px;
	color: #808080;
white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: pre-wrap;      /* CSS3 */
    word-wrap: break-word;      /* IE 5.5+ */

}
	
hr {display:none;}
	
br.clear{clear:both;}

#wrapper {
	width:860px;
	margin:0 auto;
	text-align: left;
	background:#ffffff url(http://img-cdn.jg.jugem.jp/07b/423685/20080107_202564.gif) repeat-y;
	}

/* ------------------------------------------
 ヘッダー
------------------------------------------ */
#header{
	width:860px;
	margin:0 auto;
	padding:15px 0;
	background-repeat: repeat-y;
}

#header .description {
	margin:13px 0 60px 48px;
	font-family:Georgia, Sans-Serif;
	font-size:12px;
	font-weight:bolder;
	color:#441f00;
}

#header .sequel {
	margin: 20px 30px 0;
	padding:3px 0;
	width:800px;
	list-style: none;
	text-align:center;
	font-size:11px;
	background-color:#e4e4e4;
}

#header .sequel a{
	color:#3d1c00;
	text-decoration: none
}

#header .sequel a:hover{
	color:#3d1c00;
	text-decoration: underline;
}

/* ------------------------------------------
 エントリー
------------------------------------------ */

#entry {
	float:left;
	width:515px;
	margin-bottom:30px;
}

#entry .date {
	font-family:"Verdana";
	font-size:11px;
	color:#666;
	margin:10px 0 15px 0;
	padding:10px;
}

#entry .title {
	font-family:Georgia, Sans-Serif;
	font-size:20px;
	font-weight:bolder;
	color:#000;
	margin:5px 0px 0px 0px;
	}

#entry .body {
	font-size:12px;
	color: #281a14;
	background: #FFF;
	font-family:"Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	line-height:150%;
	}
	
#entry .line {
	width:515px;
	height:50px;
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20080418_270875.gif);
	margin-bottom:20px;
	}
	
#entry .state {
	margin: 20px 0px 25px 0px;
	font-family:"Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	font-size:10px;
	color:#000;
	}

/* ------------------------------------------
   サイドメニュー
------------------------------------------ */

#sidebar {
	float:right;
	width:225px;
}

#sidebar .list a,#sidebar .feed a{
	color:#f88ba7;
	text-decoration: none;
}

#sidebar .list a:hover.#sidebar .feed a:hover{
	color:#f88ba7;
	text-decoration: underline;
}

#sidebar .ti_entries ,
#sidebar .ti_archives ,
#sidebar .ti_categories ,
#sidebar .ti_links  {
	margin:15px 0 10px;
	text-indent:-9999px;
	display:block;
}

#sidebar .ti_entries {
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20070721_38929.gif) no-repeat ;
	width:58px;
	height:12px;
}

#sidebar .ti_archives {
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20070721_38932.gif) no-repeat ;
	width:67px;
	height:12px;
}

#sidebar .ti_categories {
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20070721_38931.gif) no-repeat ;
	width:80px;
	height:12px;
}

#sidebar .ti_links {
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20070721_38928.gif) no-repeat ;
	width:44px;
	height:12px;
}

#sidebar .list li{
	margin:0 0 0 5px;
	padding:0 0 0 15px;
	font-family: "Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	font-size: 11px;
	color: #333;
	line-height: 150%;
	background: url(http://img-cdn.jg.jugem.jp/07b/423685/20080418_270872.gif) no-repeat ;
}

#sidebar .item{
	text-align:center;
	font-size: 11px;
}

#sidebar .feed {
	margin:10px 0;
	padding:10px;
	font-family: "Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	font-size: 11px;
	color: #333;
	line-height: 170%;
    border-top:dotted 1px #666;
    border-bottom:dotted 1px #666;
}

#sidebar .ad {
	margin:10px;

}

/* ------------------------------------------
 フッター
------------------------------------------ */
.navi{
font-size:11px;
margin:10px 0;
}

#footer{
	text-align: center;

}
#footer .copyright {
	font-family: "Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	font-size: 11px;
	color: #333;
	line-height: 170%;
	margin: 0px;
}

#footer .pagetop {
	margin: 20px 0px 20px;
}

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