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

ホーム

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

テンプレート名 : Seshat｜書記の女神

HTML・CSSをコピーして使う

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML lang="ja" xml:lang="ja">
<head>
<meta http-equiv="content-language" content="ja" />
<meta http-equiv="Content-Type" content="text/html; charset={site_encoding}" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" /> 
<link rel="stylesheet" href="{site_css}" type="text/css" />
<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}" />

<div id="wrapper">
<div id="layout">
	<div id="header">
		<div class="h_top">
			
			<h1 class="site_title">{blog_name}</h1>
			<p class="description">{blog_description}</p>
			
		</div>
	</div>

<div id="container">
		
		<div class="entry_navi">
			<ul>
				<li class="others_1">{prev_entry}</li>
				<li class="others_2"><a href="./">Main</a></li>
				<li class="others_3">{next_entry}</li>
			</ul>
		</div>

<div class="entry">
			<div class="entry_title"><h2>{entry_title}</h2></div>
			<div class="entry_date"><h3>{entry_date}</h3></div>
			<div class="entry_body">{entry_description}</div>
			<div id="sequel" class="entry_body">{entry_sequel}</div>
			<div class="entry_author"><p>Author : {user_name}</p></div>
			<div class="entry_state">
				<ul>
					<li class="others_1">{category_name}</li>
					<li class="others_2">{entry_time}</li>
					<li class="others_2">{comment_num}</li>
					<li class="others_3">{trackback_num}</li>
				</ul>
			</div>
			<div class="entry_title">{trackback_auto_discovery}</div>
		</div>

<div id="comments" class="entry">
			<div class="entry_container">
				
				<div class="entry_body">{comment_description}</div>
					<div class="entry_state">
					<ul>
						<li class="others_1">{comment_name}</li>
						<li class="others_3">{comment_time}</li>
					</ul>
				</div>
				
				<div class="comment_title"><p>It comments.</p></div>
				<div class="entry_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" rows="10" cols="50" style="width:400px;"></textarea><br /><br />
						<input tabindex="5" type="submit" value="Comment transmission" onclick="javascript:setval();" />
						<input type="checkbox" name="set_cookie" value="1" id="set_cookie">
						<label for="set_cookie">It registers in cookis.</label>
					</form>
				</div>
				</div>
			</div>

<div id="trackback" class="entry">
				<div class="entry_container">
					<div class="trackback-title">Track back Url of this Article</div>
					<div class="entry_body">{trackback_url}</div>
					<div class="trackback-title">Track Back</div>
					
					<div class="entry_title"><p>{trackback_title}</p></div>
					<div class="entry_body">{trackback_excerpt}</div>
					<div class="entry_state"><p>  {trackback_blog_name} | {trackback_time} </p></div>
					
				</div>
			</div>

<div class="entry">
				<div class="comment_title"><p>Profile</p></div>
				<div class="entry_body2">{profile_name}</div>
				<div class="entry_body2">{profile_description}</div>
			</div>

<div class="entry">
				<ul class="navi">
					<li class="navi_ct">{prev_page_link}&nbsp;</li>
					<li class="navi_ct">{page_now}/{page_num}Pages</li>
					<li class="navi_ct">&nbsp;{next_page_link}</li>
				</ul>
			</div>
			
		</div>
			
		<div id="sidebar">
		
			<div class="menu_title"><p>Profile</p></div>
			<div class="menu_text">{user_list}</div>

<div class="menu_title"><p>Category</p></div>
		<div class="menu_text">{category_list}</div>

<div class="menu_title"><p>Archives</p></div>
		<div class="menu_text">{archives_list}</div>

<div class="menu_title"><p>Recent Comment</p></div>
		<div class="menu_text">{recent_comment_list}</div>

<div class="menu_title"><p>Recommend</p></div>
		
		<div class="menu_text">
			<div class="menu_recommend">
				<a href="{amazon_url}" target="_blank"><img src="{amazon_ImageUrlSmall}" alt="{amazon_ProductName}" class="amazon_pict" /></a>
				<p>{amazon_ProductName}</p>
			</div>
		</div>

<div class="menu_title" style="clear:left;"><p>Links</p></div>
		<div class="menu_text">{link_list}</div>

<div class="menu_title"><p>{freespace_title1}</p></div>
		<div class="menu_text">{freespace_contents1}</div>

<div class="menu_title"><p>{freespace_title2}</p></div>
		<div class="menu_text">{freespace_contents2}</div>

<div class="menu_title"><p>{freespace_title3}</p></div>
		<div class="menu_text">{freespace_contents3}</div>

<div class="menu_title"><p>{freespace_title4}</p></div>
		<div class="menu_text">{freespace_contents4}</div>

<div class="menu_title"><p>{freespace_title5}</p></div>
		<div class="menu_text">{freespace_contents5}</div>

<div class="menu_title"><p>Management</p></div>
		<div class="menu_text">
		<p><a href="./admin/">Login</a></div>
		<div class="menu_title"><p>Feeds</p></div>
		<div class="menu_text">
		<ul>
			<li><a href="./?mode=rss">Rss1.0</a></li>
			<li><a href="./?mode=atom">Atom0.3</a></li>
		</ul>
		</div>

<div class="menu_title"><p>Mobile</p></div>
		<div class="menu_text">{site_qrcode}</div>

<div class="menu_title"><p>Recent TB</p></div>
		<div class="menu_tb"><p>{recent_trackback_list}</p></div>

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

</div>

<div id="footer">
		<p class="top"><a href="#top">▲top</a></p>
		<p class="copyright">Copyright (C) 2012 {site_title} Some Rights Reserved.</p>
	</div>

</div>
</div>

</body>
</html>

CSS

@charset "EUC-JP";

/*-----------------------------------------------
__CSS infromation

Site URL:		http://wing-of-heart.jugem.jp/
Summary:		Blog style　Seshat（書記の女神）
Created:		2012-01-07
Last update:	2012-01-07 by nob

Order of description

-Search Key"__"+"id Name of Class Name"

/__Default_style_clear
/__Universal selector
/__Structure Module
/__text Module
/__Hypertext Module
/__wrapper				(div#wrapper)
/__layout				(div#layout)
/__header				(div#header)
/__container			(div#container)
/__sidebar				(div#sidebar)
/__footer				(div#footer)

----------------------------------------------*/

/*-----------------------------------------------
__Default_style_clear
----------------------------------------------*/

/*--------------------------------------
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 3.3.0
build: 3167
*/

html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}

--------------------------------------*/

*--------------------------------------
__Universal selector
---------------------------------------*/

* {
	margin: 0;
	padding: 0;
	line-height: 1.6;
	color: #333;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
}

/*------------------------------------------------- 
__全体設定
 -------------------------------------------------*/

body {
	margin-bottom: 10px;
	background: #FFF;
	color: #333;
	font: 13px/1.231 "Century Gothic","メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS P Gothic", sans-serif;
	line-height: 1.6;
	*font-size: 81.25%;
	*font: x-small; /* for IE in quirks mode */
	text-align: center;
}

* html body {
	font-family: "Century Gothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
}

* img {
	_vertical-align: bottom;
}

select,input,button,textarea,button {
	font: 99% arial,helvetica,clean,sans-serif;
}

table {
	font-size: inherit;
	font:100%;
}

.text10 { font-size:77%; }
.text11 { font-size:85%; }
.text12 { font-size:93%; }
.text13 { font-size:100%; }
.text14 { font-size:108%; }
.text15 { font-size:116%; }
.text16 { font-size:123.1%; }
.text17 { font-size:131%; }
.text18 { font-size:138.5%; }
.text19 { font-size:146.5%; }
.text20 { font-size:153.9%; }
.text21 { font-size:161.6%; }
.text22 { font-size:167%; }
.text23 { font-size:174%; }
.text24 { font-size:182%; }
.text25 { font-size:189%; }
.text26 { font-size:197%; }

pre,code,kbd,samp,tt {
	font-family: monospace;
	*font-size: 108%;line-height:100%;
}

iframe {
	border:none;
}

/*-----------------------------------------------
__Hypertext Module
----------------------------------------------*/

a:link {
	color:#666;
}

a:visited {
	color: #666;
}

a:hover {
	color: #CCC;
	text-decoration: none;
}

/*-----------------------------------------------
__wrapper
----------------------------------------------*/

#wrapper{
	width:900px;
	margin:0 auto;
	text-align:left;
}

/*-----------------------------------------------
__layout
----------------------------------------------*/

#layout{
	float:left;
	width:900px;
	background-color:#FFF;
}

/*-----------------------------------------------
__header
----------------------------------------------*/

#header{
	margin-bottom: 30px;	
	float: left;
	width:900px;
	background-color:#FFF;
}

#header .h_top{
	padding:30px 10px 15px 20px;
}

#header .h_top .site_title{
	clear:left;
	padding-bottom:5px;
	font-size:2em;
}

#header .h_top .description{
	font-size:93%;
	padding-bottom:10px;
}

#header .h_top .others{
	font-size:85%;
	border:none;
}

#header .h_top .others ul{
	padding-bottom:25px;
}

#header .h_top .others li{
	float:left;
	margin-right:10px;
}

#header .h_top .site_title a{color: #333; text-decoration: none; }
#header .h_top .site_title a:link{color: #333; text-decoration: none; }
#header .h_top .site_title a:visited{color: #333; text-decoration: none; }
#header .h_top .site_title a:active{color: #333; text-decoration: none; }
#header .h_top .site_title a:hover{color: #999; text-decoration: none; }

/*-----------------------------------------------
__container 
----------------------------------------------*/

#container{
	margin-bottom:15px;
	float: right;
	width:650px;
	_overflow: hidden;
	position: relative;
	top: -4px;
}

#container .entry_navi{
	padding-bottom:20px;
	float:left;
	width:650px;
	font-size:85%;
}

#container .entry_navi ul{
	margin-left:15px;
}

#container .entry_navi ul li{
	float:left;
	padding-right:5px;
}

#container .entry{
	clear:left;
	padding:0 15px 15px 15px;
}

#container .entry_title{
	width: 650px;
	float: left;
}

#container .entry_title h2{
	margin: 0;
	padding: 0;
	padding-left:5px;
	border-bottom:1px solid #EEE;
}

#container .entry_title h2:first-letter{
	font-size:180%;
	color:#000;
}

#container .entry_date{
	width: 650px;
	float: left;
	margin-top: 5px;
	padding-left:5px;
	padding-bottom:10px;
}

#container .entry_body{
	padding-left:5px;
	padding-bottom:10px;
}

#container .entry_author{
	padding-top:10px;
	padding-left:5px;
	padding-bottom:15px;
}

#container .entry_author p{
}

#container .entry_state{
	padding-left:5px;
	padding-bottom:35px;
}

#container .entry_state ul{
	font-size:100%;
}

#container .entry_state ul li{
	float:left;
	padding-right:10px;
}

#container .comment_title{
	clear:left;
	margin-top:10px;
	padding-bottom:10px;
}

#container .comment_title p{
	padding-left:5px;
	font-size:120%;
	border-bottom:1px solid #EEE;
	color:#CCC;
}

#container .comment_title p:first-letter{
	font-size:120%;
	color:#999;
}

#container .trackback-title{
	margin-top:20px;
	padding-left:5px;
}

#container .navi{
	padding-bottom:15px;
	font-size:1.0em;
}

#container .navi_ct{
	float:left;
	padding-right:5px;
}

/*-----------------------------------------------
__sidebar
----------------------------------------------*/

#sidebar{
	float:left;
	width:250px;
	margin-bottom:15px;
	_overflow: hidden;
	_position: relative;
	_top: -3px;
}

*:first-child+html #sidebar{
	position: relative;
	top: 5px;
}

#sidebar .menu_title{
	float:left;
	width:220px;
	padding:0 30px 10px 15px;
}

#sidebar .menu_title p{
	line-height:normal;
	padding-left:5px;
	padding-bottom: 5px;
	border-bottom:1px solid #EEE;
}

#sidebar .menu_title p:first-letter{
	font-size:180%;
	color:#000;
}

#sidebar .menu_text,#sidebar .menu_recommend,#sidebar .menu_tb{
	padding:0 25px 25px 20px;
	font-size: 93%;
	line-height:1.8;
}

#sidebar .menu_text,#sidebar .menu_recommend{
	float: left;
	width:220px;
}

#sidebar .menu_text{
	margin-bottom:25px;
	float:left;
	width:220px;
}

#sidebar .menu_tb{
	margin-bottom:10px;
}

#sidebar .menu_text p,#sidebar .menu_tb{
	font-size:93%;
}

#sidebar .menu_recommend img{
	float:left;
	margin-top: 10px;
	margin-bottom:10px;
	position: relative;
	left: -15px;
}

#sidebar .menu_recommend p{
	float:left;
}

#sidebar .ad{
	padding:0 15px 15px 15px;
}

/*-----------------------------------------------
__footer
----------------------------------------------*/

#footer{
	clear:both;
	width:900px;
	height:65px;
	margin:0 auto;
	font-size: 93%;
}

#footer .top{
	position:relative;
	top:-20px;
	padding-left:30px;
}

#footer .copyright{
	text-align:center;
}

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