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

ホーム

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

テンプレート名 : レースと花とピンク

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-Style-Type" content="text/css" />
<title>{site_title}</title>
<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}" />
<script type="text/javascript" src="template/js/cookie.js"></script>
</head>
<body onload="javascript:initval();">
<div id="whole">
<div class="naiv_left">

<div class="linktitle"><span class="p_col">C</span>ATEGORIES</div>
<div class="linktext">{category_list}</div>

<div class="linktitle"><span class="p_col">A</span>RCHIVES</div>
<div class="linktext">{archives_list}</div>

<div class="linktitle_rcmd">RECOMMENDED</div>

<div class="amazon_text">{amazon_item}</div>

<div class="linktitle_rcmd">OTHERS</div>
<div class="linktext">
<ul>
<li><a href="./admin/" target="_blank">管理者ページ</a></li>
<li><a href="./?mode=rss" target="_blank">RSS</a></li>
<li><a href="./?mode=atom" target="_blank">ATOM</a></li>
</ul>
<div class="jugem_bana">
{site_qrcode}<br />
{ad}
</div>
</div>

</div>

<div id="layout">
<div id="header">
<div id="site_title">

<h1 class="site_title">{blog_name}</h1>
<div class="description">{blog_description}</div>

</div>

<div class="calendar">{calendar_horizontal}</div>

</div>

<div id="contents">
<div id="main">
<div class="pad">

<div class="entry_navi">
 {prev_entry} | <a href="">main</a> | {next_entry} 
</div>


<div class="entry">
<div class="entry_header">
<div class="entry_date">{entry_date} {entry_time_only}</div>
<div class="entry_title"><a href="{entry_permalink}">{entry_title}</a></div>
</div>
<div class="entry_body">{entry_description}
<a name="sequel"></a>
<div class="entry_more">{entry_sequel}</div>
</div>
<div class="entry_state"> {user_name} | {category_name} | {comment_num} | {trackback_num} | <a href="#top">▲</a></div>
</div>
{trackback_auto_discovery}


<a name="comments"></a>
<div class="entry_ct">
<div class="ct-title">Comment</div>

<div class="comment_body">
<table cellpadding="0" cellspacing="0">
<tr>
<td><img src="http://img-cdn.jg.jugem.jp/790/355965/20080206_300288.gif" alt="comment_area" width="350" height="10" /></td>
</tr>
<tr>
<td>
<div class="ct_description">{comment_description}</div></td>
</tr>
<tr>
<td><img src="http://img-cdn.jg.jugem.jp/790/355965/20080206_300285.gif" alt="comment_area" width="350" height="22" /></td>
</tr>
</table>
</div>
<div class="entry_ct_state"><span class="light_bg">(..)φ</span> {comment_name} <br /> {comment_time}</div>
<br class="clear" />

<div class="ct-title">It comments.</div>
<div class="entry_ct_body">
<form name="comment_area" id="comment_area" action="./?mode=comment" method="post">
<input type="hidden" name="entry_id" value="{entry_id}" style="width:250px;" class="form_color" />
<label for="name">name:</label><br />
<input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" style="width:250px;" class="form_color" /><br />
<label for="email">email:</label><br />
<input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" style="width:250px;" class="form_color" /><br />
<label for="url">url:</label><br />
<input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" style="width:250px;" class="form_color" /><br />
<label for="description">comments:</label><br />
<textarea tabindex="4" id="description" name="description" rows="10" cols="50" style="width:350px;" class="form_color"></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>


<div class="entry_ct">
<div class="ct-title">Trackback URL of This Entry</div>
<div class="entry_tb">{trackback_url}</div>
<div class="ct-title">Trackback</div>

<div class="entry_ct_body">
<div class="entry_title_trb">{trackback_title}</div>
{trackback_excerpt}
<div class="trackback_state"><span class="light_bg">(^ｰﾟ)ﾉ</span> {trackback_blog_name} | {trackback_time}</div>
</div>
</div>

<div class="entry_ct">
<div class="ct-title">プロフィール</div>
<div class="entry_ct_body">
<div class="entry_title_trb">{profile_name}</div>
{profile_description}</div>
</div>

<div class="page">{prev_page_link}  / {page_now}/{page_num}PAGES /  {next_page_link}</div>

</div>
</div>
<div id="navi">

<div class="linktitle"><span class="p_col">S</span>ELECTED ENTRIES</div>
<div class="linktext">{selected_entry_list}</div>

<div class="linktitle"><span class="p_col">R</span>ECENT COMMENT</div>
<div class="linktext">
<div id="commentlist">{recent_comment_list}</div>
</div>

<div class="linktitle"><span class="p_col">R</span>ECENT TRACKBACK</div>
<div class="linktext">
<div id="tblist">{recent_trackback_list}</div>
</div>

<div class="linktitle"><span class="p_col">L</span>INKS</div>
<div class="linktext">{link_list}</div>

<div class="border"> </div>

<form method="get" action="">
<div class="search">
<input id="search" name="search" size="20" style="width:150px" class="form_color" />
<input type="submit" value="Search" class="button" />
</div>
</form>

<div class="title_about">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="prof_lf">ABOUT
</td>
<td class="prof_rg">
<div class="linkabout">{user_list}</div>
</td>
</tr>
</table>
</div>

<div class="linktitle">{freespace_title1}</div>
<div class="linktext">
{freespace_contents1}
</div>

<div class="linktitle">{freespace_title2}</div>
<div class="linktext">
{freespace_contents2}
</div>

<div class="linktitle">{freespace_title3}</div>
<div class="linktext">
{freespace_contents3}
</div>

<div class="linktitle">{freespace_title4}</div>
<div class="linktext">
{freespace_contents4}
</div>

<div class="linktitle">{freespace_title5}</div>
<div class="linktext">
{freespace_contents5}
</div>

</div>
</div>
</div>

<div id="footer">
<div class="copyright">{copyright} | designed by  <a href="http://komimisyobou.jugem.jp/" target="_blank">komimisyobou</a>.<br />
	  素材お借りしました | <a href="http://photo-theater.com/" target="_blank">写真素材シアター</a> | <a href="http://www.lacelace.com/" target="_blank">レースの壁紙</a> | </div>
	  <div class="linktext_right"><a href="#top">▲このページの先頭へ</a></div>
    </div>  
</div>
<script type="text/javascript">

  </script>
</body>
</html>

CSS

body {
margin: 0px;
padding: 0px;
 color: #999999;
 background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080212_303172.gif);
 background-repeat: repeat-y;
 background-position: left top;
}
html,body{
    scrollbar-arrow-color: #ffffff;
    scrollbar-track-color: #a7997a;
    scrollbar-face-color: #ffffff;
    scrollbar-shadow-color: #c95a4b;
    scrollbar-darkshadow-color: #873429;
    scrollbar-highlight-color: #c95a4b;
    scrollbar-3dlight-color: #fed1cb;
}
/* block id */
#whole {
	width: 950px;
	padding: 0px;
	margin: 0px;
}
#layout { width: 770px; float: left; margin: 0px;}
#header { width: 770px; background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080205_299745.jpg); background-repeat: no-repeat; text-align: left; height: 185px; margin: 0px 0px 25px 0px; border-bottom: 1px solid #FF829D;}
#site_title { margin-top: 0px; margin-left: 0px; padding-top: 10px; padding-left: 15px; height: 155px;}
#contents { margin: 0px; width: 770px; border-top: 1px solid #FF829D}
#main { float: left; width: 530px; background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080204_299327.gif); background-repeat: repeat-y; margin-bottom: 20px; }
#navi { float: right; width: 240px; margin: 0px 0px 20px 0px;}
#footer {
	clear: both;
	width: 940px;
	text-align: center;
	color: #6A5ACD;
	font-size: 10px;
	line-height: 1.5em;
	background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080207_300705.jpg);
	background-repeat: repeat;
	padding: 5px;
	border-top: 1px solid #FF829D;
	background-position: bottom;
	margin: 0px;
}

/* common */
div {font-family: "Verdana", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅"}
td { font-family: Verdana, "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", Osaka‐等幅; margin: 0px; padding: 0px; }
p { margin : 0 ; }
.form_color    { background-color: #ffffe0; }
img{ border: 0px; }
.pict { border-width: 1px; border-style: solid; border-color: #999; padding: 7px 7px 20px 7px; margin: 5px; background: #FFFFFF; }
.page { color: #6A5ACD; font-size: 10px; text-align: center; padding: 10px 0 0 0; }
.button { margin: 5px 0 0 0 }
ul { margin: 0px 0px 0px 15px; padding: 0px }
li{ list-style-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080131_297323.gif); list-style-position: outside ; }
.border { margin: 0px; padding: 10px; border-bottom: 1px dotted #FF829D ; }
.review_desc { font-size: 10px; line-height: 140% ; }
.clear { clear: both; font: 0px/0px sans-serif ; }
input { background-color: #fed1cd; color: #666666; }
.p_col { color: #fed1cb; padding: 1px 2px 1px 2px; background-color: #DC143C;
margin-right: 1px;
border-top: #FF69B4 1px solid;
border-left: #FF69B4 1px solid;
 }
blockquote { font-size:11px; color: #864e4e; margin: 20px 10px 20px 10px; padding: 10px; background-color: #FFDAB9; line-height: 1.7em;}
.light_bg { background-color: #FFFFE0; padding: 1px; color: #DB7093;}

/* option */
.linktext_right { font-size: 10px; line-height: 1.7em; color: #DB7093; text-align: right;
}
.jugem_bana{
	margin-top: 5px;
	margin-bottom: 5px;
	text-align: center;
}
.jugem_theme { font-size: 10px; line-height: normal; color: #DB7093; text-align: right; margin-right: 10px;
}
.review_info { font-size: 10px; line-height: 1.5em; color: #7B68EE; 
}

/* header area */
h1 { font-size: 18px; line-height: 1.5em; color: #DB7093; margin: 0px;
}
.description { font-size: 10px; line-height: 1.5em; color: #CD5C5C ; width: 450px; margin: 5px 10px 10px 0px;
}
.calendar { margin: 5px 0px 2px 0px;text-align: center; font-family: Georgia, "Times New Roman", Times, serif; font-size: 10px; color: #CD5C5C ;
}

/* left nabi area */
.naiv_left { float: left; width: 165px; height: 100px; text-align: left; padding: 0px 10px 0px 5px; margin: 0px; 
}
.linktitle_rcmd { background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300298.gif); background-repeat: no-repeat; background-position: left bottom; text-align: center; height: 15px; padding-top: 2px; padding-bottom: 8px; margin: 0px; font-family: Georgia, "Times New Roman", Times, serif; color: #DC143C; font-size: 12px; line-height: 1.5em; font-weight: bold;
}
.amazon_text {
	font-size: 10px;
	line-height: normal;
	color: #F08080;
	padding: 0px;
	text-align: center;
	margin-top: 8px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 0px;
}

/* main area */
.pad { padding: 5px; margin-top: 20px; margin-bottom: 20px;
}
.entry_navi, .page { font-size: 12px; color: #DB7093; text-align: left; margin: 10px;
}
/* entry area */
.entry { text-align: left; margin-bottom: 40px; padding-right: 20px; padding-left: 10px; width: 490px;
}
.entry_header { background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300231.gif); background-repeat: no-repeat; height: 55px; width: 490px; margin: 0px;
}
.entry_date { font-size: 10px; color: #DB7093; text-align: right; margin: 5px 5px 10px 0px ;
}
.entry_title { font-size: 14px; font-weight: bold; line-height: 1.7em; color: #DB7093; padding-left: 15px;
}
.entry_body {
	font-size: 12px;
	line-height: 1.7em;
	color: #708090;
	background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300229.gif);
	background-repeat: repeat-y;
	width: 450px;
	margin: 0px;
	padding: 10px 20px 10px 20px;
}
.entry_more { font-size: 12px; line-height: 1.7em; color: #708090;
}
.entry_state { font-size: 10px; line-height: 1.7em; color: #DB7093; text-align: right; background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300227.gif); background-repeat: no-repeat; height: 19px; padding-top: 5px; padding-right: 10px;
}
/* comment area */
.entry_ct { width: 490px; margin-right: 20px; margin-left: 10px;
}
.ct-title { background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300298.gif); background-repeat: no-repeat; background-position: left bottom; height: 24px; font-size: 14px; color: #DC143C; font-weight: bold; font-family: Georgia, "Times New Roman", Times, serif; padding-left: 10px; width: 420px;
}
.comment_body { padding: 5px 10px 0px 0px;
}
.ct_description {
	font-size: 11px;
	line-height: 1.5em;
	color: #CD5C5C;
	text-align: left;
	margin: 0px;
	background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300287.gif);
	background-repeat: repeat-y;
	width: 315px;
	padding: 5px 25px 5px 10px;
}
.entry_ct_state {
	font-size: 10px;
	line-height: 1.3em;
	color: #FFF0F5;
	background-color: #DB7093;
	width: 125px;
	float: right;
	margin: -30px 15px 5px 0px;
	padding: 5px 8px 5px 8px;
}
.entry_ct_body {
	width: 415px;
	background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080206_300229.gif);
	background-repeat: repeat-y;
	font-size: 12px;
	line-height: 1.5em;
	color: #666666;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 25px;
	margin-left: 10px;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 15px;
}
/* trackback area */
.entry_tb { font-size: 12px; line-height: 1.5em; color: #708090; background-color: #ffffe0; text-align: center; padding: 1px 5px 1px 5px; margin: 5px 60px 15px 10px;
 border-top: 1px solid #C2BFA5;
 border-right: 2px solid #8D8961;;
 border-bottom: 2px solid #8D8961;
 border-left: 1px solid #C2BFA5;
}
.entry_title_trb {
	font-size: 14px;
	line-height: 1.5em;
	font-weight: bold;
	margin-bottom: 10px;
	border-bottom: 2px double #DB7093;
	color: #FF1493;
}
.trackback_state { background-color: #DB7093; font-size: 10px; line-height: 1.5em; color: #FFFFE0; text-align: right; padding: 3px; margin-top: 10px;
}

/* nabi area */
.linktitle {
	background-image: url(http://img-cdn.jg.jugem.jp/790/355965/20080131_297316.jpg);
	background-repeat: no-repeat;
	background-position: right;
	text-align: left;
	height: 20px;
	padding: 8px 10px 3px 10px;
	margin: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #DC143C;
	font-size: 12px;
	line-height: 1.5em;
	font-weight: bold;
}
.linktext { font-size: 10px; padding: 10px; line-height: 1.7em; color: #DB7093;}
.search { color: #666666; font-size: 10px; line-height: 170%; text-align: center; margin: 0px 0px 5px; padding: 5px 0px }
.title_about { text-align: right; margin-right: 20px; margin-top: 0px;}
.prof_lf { color: #FFF0F5; background-color: #7B68EE; border: 1px solid #7B68EE; padding: 2px 5px 2px 5px; font-size: 10px; text-align: center;}
.prof_rg { color: #7B68EE; background-color: #FFF0F5; border: 1px solid #7B68EE; padding: 2px 5px 2px 5px; font-size: 10px; text-align: center;}

/* footer area */
.copyright { margin-bottom: 5px;}

/* linkcolor */
a     { color: #483D8B; text-decoration: none; }
a:link    { color: #483D8B; text-decoration: none; }
a:visited { color: #483D8B; text-decoration: none; }
a:active  { color: #FF1493; text-decoration: none ; }
a:hover   { color: #FF1493; text-decoration: none ; }

.site_title a    { color: #DC143C; text-decoration: none ; border-bottom: 2px #FFB6C1 dotted; }
.site_title a:link   { color: #DC143C; text-decoration: none ; border-bottom: 2px #FFB6C1 dotted; }
.site_title a:visited   { color: #DC143C; text-decoration: none ; border-bottom: 2px #FFB6C1 dotted; }
.site_title a:active    { color: #FF1493; text-decoration: none ; border-bottom: 2px #FF1493 dotted; }
.site_title a:hover    { color: #FF1493; text-decoration: none ; border-bottom: 2px #FF1493 dotted; }

.entry_body a   { color: #DC143C; text-decoration: none ; border-bottom: 2px #FFB6C1 dotted; }
.entry_body a:link    { color: #DC143C; text-decoration: none ; border-bottom: 2px #FFB6C1 dotted; }
.entry_body a:visited { color: #C71585; text-decoration: none ; border-bottom: 2px #FFB6C1 dotted; }
.entry_body a:active  { color: #FF1493; text-decoration: none ; border-bottom: 2px #FF1493 dotted; }
.entry_body a:hover   { color: #FF1493; text-decoration: none ; border-bottom: 2px #FF1493 dotted; }

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