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

ホーム

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

テンプレート名 : Night Town

HTML・CSSをコピーして使う

HTML

<?xml version="1.0" encoding="EUC-JP"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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-Type" content="text/html; charset=EUC-JP" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>{site_title}</title>
<link rel="stylesheet" href="{site_css}" type="text/css" />
<link type="text/css" href="{gmo_header_css}" rel="stylesheet" media="screen,print" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="{site_rss}" />
<link rel="alternate" type="application/atom+xml" href="{site_atom}" />
<link rel="alternate" media="handheld" type="application/xhtml+xml" href="{mobile_url}" />
<script type="text/javascript" src="./template/js/cookie.js"></script>
</head>

<div id="page">

<div id="header">
<h1 id="top"><span>{blog_name}</span></h1>
<h2><span>{blog_description}</span></h2>
<hr />
</div>

<div id="content">

<div id="main">

<div class="navi"><ul>
<li class="prev-entry">{prev_entry}</li>
<li class="main"><a href="./">main</a></li>
<li class="next-entry">{next_entry} </li>
</ul></div>

<div class="entry_one">
<div class="entry">
<div class="entry-header"><h3>{entry_title}</h3></div>
<div class="entry-body">
<div class="date">{entry_date}</div>
<div class="note">{entry_description}</div>

<div class="more"><p>{entry_sequel}</p></div>

</div>
<div class="entry-footer">
<div class="info"><ul>
<li class="name"><span>{user_name}</span></li>
<li class="time"><span>{entry_time}</span></li>
<li class="category">{category_name}</li>
<li class="count-com">{comment_num}</li>
<li class="count-tb">{trackback_num}</li>
<li class="return"><a href="#top">▲</a></li>
</ul></div>
</div>

</div>
</div>
{trackback_auto_discovery}
<hr />

<a name="comments"></a>
<div class="comment-area">

<div class="comment-header"><h4><span>Comment</span></h4></div>
<div class="comment-body">
<a name="{comment_id}" id="{comment_id}"></a>
<a name="comment_id" id="comment_id"></a>
<div class="note">{comment_description}</div>
</div>
<div class="comment-footer">
<div class="info"><ul>
<li class="name"><span>{comment_name}</span></li>
<li class="time"><span>{comment_time}</span></li>
</ul></div>
</div>


<div class="comment-form">
<div class="comment-header"><h4><span>Submit Comment</span></h4></div>
<div class="comform-body">
<div class="note">
<form name="comment_area" id="comment_area" action="./?mode=comment" method="post">
<dl>
<dt><label for="name">name:</label></dt>
<dd><input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" /></dd>
<dt><label for="email">email:</label></dt>
<dd><input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" /></dd>
<dt><label for="url">url:</label></dt>
<dd><input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" /></dd>
<dt><label for="description">comments:</label></dt>
<dd><textarea tabindex="4" id="description" name="description" rows="8" cols="50"></textarea><br />
<input tabindex="5" type="submit" value="Submit" onclick="javascript:setval();" class="submit" />
<input type="checkbox" name="set_cookie" value="1" id="set_cookie" />
<label for="set_cookie">Cookieに登録</label></dd>
</dl>
<p><input type="hidden" name="entry_id" value="{entry_id}" /></p>
</form>
</div>
</div>
<div class="comform-footer"></div>
</div>

</div>

<div class="trackback-area">
<h4><span>Trackback URL：</span></h4>
<p>{trackback_url}</p>

<div class="tb-header"><h4><span>Trackback</span></h4></div>
<div class="tb-body">
<strong>{trackback_title}</strong>
<div class="note">{trackback_excerpt}</div>
</div>

<div class="tb-footer">
<div class="info"><ul>
<li class="name"><span>{trackback_blog_name}</span></li>
<li class="time"><span>{trackback_time}</span></li>
</ul></div>
</div>

</div>

<div class="profile-area">
<div class="profile-header"><h3><span>{profile_name}</span></h3></div>

<div class="profile-body">
<div class="note">{profile_description}</div>
</div>

<div class="navi"><ul>
<li class="prev">{prev_page_link}</li>
<li class="now">{page_now}</li>
<li class="page-num">{page_num} PAGES</li>
<li class="next">{next_page_link}</li>
</ul></div>

</div>

<div id="side">

<div id="recent" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>RECENT ENTRIES</span></h5>
{selected_entry_list}
</div>
<hr />

<div id="archive" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>ARCHIVES</span></h5>
{archives_list}
</div>
<hr />

<div id="category" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>CATEGORY</span></h5>
{category_list}
</div>
<hr />

<div id="recent-comment" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>RECENT COMMENTS</span></h5>
<ul>

<li><a href="./?eid={recent_comment_item_entry_id}#{recent_comment_item_comment_id}"> {recent_comment_item_name}　[{recent_comment_item_date}]</a></li>

</ul>
</div>
<hr />

<div id="recent-trackback" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>RECENT TRACKBACKS</span></h5>
<ul><li>{recent_trackback_list}</li></ul>
</div>
<hr />

<div id="recommend" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>RECOMMEND</span></h5>

<ul>
<li class="image"><a href="{amazon_url}"><img src="{amazon_ImageUrlSmall}" alt="amazon image" /></a></li>
<li class="productname"><a href="{amazon_url}">{amazon_ProductName}</a></li>
<li class="creator">{amazon_Creator}</li>
<li class="comment">{amazon_comment}</li>
</ul>

</div>
<hr />

<div id="link" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>LINKS</span></h5>
{link_list}
</div>
<hr />

<div id="profile" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>PROFILE</span></h5>
{user_list}
</div>
<hr />

<div class="free">
<h5>{freespace_title1}</h5>
{freespace_contents1}
</div>
<hr />

<div class="free">
<h5>{freespace_title2}</h5>
{freespace_contents2}
</div>
<hr />

<div class="free">
<h5>{freespace_title3}</h5>
{freespace_contents3}
</div>
<hr />

<div class="free">
<h5>{freespace_title4}</h5>
{freespace_contents4}
</div>
<hr />

<div class="free">
<h5>{freespace_title5}</h5>
{freespace_contents5}
</div>
<hr />

<div id="search-area" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>SEARCH</span></h5>
<form method="get" action="">
<p><input id="search" name="search" size="20" />
<input type="submit" value="Search" class="submit" /></p>
</form>
</div>
<hr />

<div id="mobile" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>MOBILE</span></h5>
<div id="qrcode">{site_qrcode}</div>
</div>
<hr />

<div id="others" class="hide" onclick="this.className='show'" ondblclick="this.className='hide'">
<h5><span>OTHERS</span></h5>
<ul>
<li id="template">Template by <a href="http://snowstar46.jugem.jp/" target="46">46</a></li>
<li><a href="./admin/">Admin</a></li>
<li><a href="./?mode=rss">RSS1.0</a></li>
<li><a href="./?mode=atom">Atom0.3</a></li>
</ul>
</div>
<hr />

<div id="sponsor">
<h5><span>SPONSORED LINK</span></h5>
<div id="ad">{ad}</div>
</div>
<hr />

</div>

</div>

<div id="footer">
<address><span>{copyright}</span></address>
</div>

</div>

</body>
</html>

CSS

@charset "EUC-JP";

/* 基本設定 ------------------------------------------------------------------------ */
* { margin:0px; padding:0px; }

body { margin:0px; color:#ffffff; background:#000000; text-align:center; font-weight:normal; font-family:Skia, 'Hiragino Maru Gothic Pro', 'ヒラギノ丸ゴ Pro W4', Osaka; }

hr { display:none; }
img { border:0px }

/* フォントサイズ ------------------------------------★ */
body { font-size:14px; *font-size:88%; }
table { font-size:inherit; font:100%; }
small { font-size:inherit; font:100%; *font-size:small; *font:x-small; }
select, input, textarea { *line-height:1.5; }
pre, code { font:115% monospace; *font-size:100%; }
body * { line-height:1.5; }

/* Basis - 14px */
.f10 { font-size:72%; } /* 10px (eq.x-small) */
.f13 { font-size:93%; } /* 13px (eq.small) */
.f16 { font-size:114.5%; } /* 16px (eq.medium) */
.f18 { font-size:128.6%; } /* 18px (eq.large) */

/* リンク ------------------------------------★ */
a { text-decoration:none; }
a:link  { color:#3388aa; }
a:visited  { color:#cccccc; }
a:hover { color:#ffffff; }
a:active {  }

/* 見出し ------------------------------------★ */
h1, h2, h3, h4, h5, h6 { font-weight:normal; }
h1 { margin:0px 15px 15px; font-size:x-large; position:relative; top:15px; }
h2 { margin:0px 15px; font-size:small; }
h3 { margin:0px 0px 0px 15px; padding:12px 0px 0px 20px; width:450px; height:28px; background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003873.gif) no-repeat 0px 0px; font-size:100%; }
h4 {  }
h5 { color:#ffffff; }
h6 {  }

/* テキスト ------------------------------------★ */
p { margin:auto auto 1em; }
address { font-style:normal; }
strong {  }
em {  }
del {  }
blockquote {  }

/* フォーム ------------------------------------★ */
input { border:1px solid #3388aa; }
textarea { border:1px solid #3388aa; }
form {  }
select {  }
option {  }

.submit { border:none; color:#3388aa; background-color:#ffffff; }
.checkbox { border:0px; background-color:transparent; }

/* リスト ------------------------------------★ */
ol { margin: 0px 0px 0px 1px; padding: 0px; }
ol li {  }

ul { margin: 0px 0px 0px 1px; padding: 0px; }
ul li {  }

dl {  }
dt { margin:0px 0px 5px; }
dd { margin:0px 0px 10px; }

dd p { margin:5px 0px 0px; }

/* 囲み ------------------------------------★ */
#page { margin:0px auto; width:700px; }
#content { margin:80px auto; text-align:left; position:relative; }

/* ヘッダー ------------------------------------★ */
#header { margin:0px auto; padding:0px; width:700px; height:100px; background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20080415_2205851.jpg) no-repeat; text-align:left; }

h1 a:link, h1 a:visited { color:#ffffff; }
h1 a:hover { color:#000000; }

* html h1 { margin:0px 20px; font-size:128.6%; }	
* html h2 { font-size:93%; }	
* html #header { height:120px; }	/* Win 用 */
html*#header { padding-left:20px; }

/* ページナビ ------------------------------------★ */
.navi { margin:0px auto 40px; width:480px; text-align:center; }
.navi ul {  }
.navi li { margin:0px 5px; padding:0px 5px; display:inline; }

.main { border-right:2px solid #586972; border-left:2px solid #586972; }
.prev-entry {  }
.next-entry {  }

.now { border-right:2px solid #586972; border-left:2px solid #586972; }
.page-num {  }
.prev {  }
.next {  }

/* メイン ------------------------------------------------------------------------ */
#main { width:450px; float:right; }

/* エントリー ------------------------------------★ */
* html h3 { height:40px; }

.entry { margin:0px 0px 70px; width:450px; }
.entry-header { width:450px; height:40px; background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003867.jpg) no-repeat; }
.entry-body {  }
.entry-footer {   }

/* 追記 */
.more{ margin:0px 20px; }

/* 日付 */
.date { margin:10px 20px 0px; text-align:right; }

/* 本文 */
.note { margin:20px; color:#3388aa; }
.note ul { margin:0px 0px 0px 20px; }
.note li { margin:0px 0px 5px; }

/* エントリー情報 */
.info { margin:0px 20px; text-align:right; }
.info ul { list-style:none; white-space:nowrap }
.info li { padding:0px 5px; display:inline; border-right:2px solid #ffffff;; }
.info .name { border-left:2px solid #ffffff; }

.info .time {  }
.category, .count-com, .count-tb {  }

/* レビュー */
.jugem_review { padding:10px; background:#222222; }

/* プロフィール */
.profile-area { margin:0px 0px 40px; position:relative; top:20px;  }
.profile-header { width:450px; height:40px; background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003867.jpg) no-repeat; }

/* コメント ------------------------------------★ */
.comment-area {  }
.comment-area ul { list-style:none; }

/*  コメントフォーム  */
.comment-form h4 { border-bottom:1px dotted #ffffff; }
.comment-form { margin:0px 0px 20px; }
.comment-form form { margin:0px 10px; }
.comment-form input { margin:5px 0px; }

/* トラックバック ------------------------------------★ */
.trackback-area {  }
.trackback-area h4 { border-bottom:1px dotted #ffffff; }
.trackback-area ul { list-style:none; }

/* サイド ------------------------------------------------------------------------ */
#side { width:200px; }
#side h5 { width:200px; height:30px; color:#ffffff; }
#side h5 span { display:none; }

/*  RECENT ENTRIES  */
#recent h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003879.gif) no-repeat; }
#recent ul { margin:5px 10px 20px; list-style:none; }

/*  ARCHIVES  */
#archive h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003874.gif) no-repeat;  }
#archive ul { margin:5px 10px 20px; list-style:none; }

/*  CATEGORY  */
#category h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003875.gif) no-repeat;  }
#category ul { margin:5px 10px 20px; list-style:none; }

/*  RECENT COMMENTS  */
#recent-comment h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20080424_2212490.gif) no-repeat;  }
#recent-comment ul { margin:5px 10px 20px; list-style:none; }

/*  RECENT TRACKBACKS  */
#recent-trackback h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20080424_2212491.gif) no-repeat;  }
#recent-trackback ul { margin:5px 10px 20px; list-style:none; }

/*  RECOMMEND  */
#recommend { margin:0px 0px 20px; text-align:center; }
#recommend h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003925.gif) no-repeat; }
#recommend ul { margin:10px 10px 15px; list-style:none; }
#recommend li { margin:0px; padding:0px; height:auto; line-height:1; }

#recommend .creator { margin-bottom:5px; }
#recommend .productname {  }
#recommend .comment{ padding-bottom:5px; text-align:left; border-bottom:1px dotted #cccccc; }

/*  LINKS  */
#link h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003876.gif) no-repeat; }
#link ul { margin:5px 10px 20px; list-style:none; }

/*  PROFILE  */
#profile h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003923.gif) no-repeat; }
#profile ul { margin:5px 10px 20px; list-style:none; }

/*  FREE SPEACH  */
.free { margin:0px 0px 30px; text-align:center; }
.free h5 { padding:5px 0px 0px 25px; background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20080416_2206547.gif) no-repeat 0px 0px; color:#b5e9f4; font-weight:normal; font-size:100%; text-align:left; }

/*  SEARCH  */
#search-area h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003881.gif) no-repeat; }
#search-area form { margin:5px 10px 20px; }
#search-area p {  }
#search-area input { width:120px; }
#search-area .submit { width:50px; }

/*  MOBILE  */
#mobile h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003920.gif) no-repeat; }
#qrcode { margin:5px 10px 20px; text-align:center; }

/*  OTHERS  */
#others { margin:0px 0px 20px; }
#others h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003921.gif) no-repeat; }
#others ul { margin:5px 10px 20px; list-style:none; }

/*  SPONSOR  */
#sponsor { margin:0px 0px 20px; text-align:left; }
#sponsor h5 { background:url(http://img-cdn.jg.jugem.jp/c8f/678807/20071026_2003926.gif) no-repeat; }
#ad { padding:10px 0px; text-align:center; }

/*  POWERD  */
#powerd p { margin:0px 0px 0px 5px; display:inline; }

/* フッター ------------------------------------★ */
#footer { margin:50px 20px; clear:both; }

/* これ以降Mac IE 5のみに適用される ?*//*/

/* これ以降Mac IE 5以外にも適用される */

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