無料ブログ作成なら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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset={site_encoding}" />
<title>{site_title}</title>

<SCRIPT LANGUAGE="JavaScript">
<!--
// スクロール用変数初期化
var pageScrollTimer;
var speed = 5;

//スクロール関数
function pageScroll(toX,toY,frms,cuX,cuY) {
 if (pageScrollTimer) clearTimeout(pageScrollTimer);
 if (!toX || toX < 0) toX = 0;
 if (!toY || toY < 0) toY = 0;
 if (!cuX) cuX = 0 + getScrollLeft();
 if (!cuY) cuY = 0 + getScrollTop();
 if (!frms) frms = 6;

if (toY > cuY && toY > (getAnchorPosObj('end','enddiv').y) - getInnerSize().height) toY = (getAnchorPosObj('end','enddiv').y - getInnerSize().height) + 1;
 cuX += (toX - getScrollLeft()) / frms; if (cuX < 0) cuX = 0;
 cuY += (toY - getScrollTop()) / frms;  if (cuY < 0) cuY = 0;
 var posX = Math.floor(cuX);
 var posY = Math.floor(cuY);
 window.scrollTo(posX, posY);

if (posX != toX || posY != toY) {
  pageScrollTimer = setTimeout("pageScroll("+toX+","+toY+","+frms+","+cuX+","+cuY+")",speed);
 }
}

function jumpToPageTop() {
  pageScroll(0,0,10);
}

function getInnerSize() {
 var obj = new Object();

if (document.all || (document.getElementById && IE)) {
  obj.width = document.body.clientWidth;
  obj.height = document.body.clientHeight;
 } else if (document.layers || (document.getElementById && Moz)) {
  obj.width = window.innerWidth;
  obj.height = window.innerHeight;
 }

return obj;
}

function getAnchorPosObj(elementname, elementid) {
 var obj = setObj(elementname);
 var objnew = new Object();
 var objtmp;

if (document.getElementById && IE) {
  objtmp = obj;
  objnew.x = objtmp.offsetLeft;
  objnew.y = objtmp.offsetTop;
  while ((objtmp = objtmp.offsetParent) != null) {
   objnew.x += objtmp.offsetLeft;
   objnew.y += objtmp.offsetTop;
  }
 } else if (document.getElementById && Moz) {
  objnew.x = document.getElementsByTagName("DIV").namedItem(elementid).offsetLeft;
  objnew.y = document.getElementsByTagName("DIV").namedItem(elementid).offsetTop;
 } else if (document.all) {
  objtmp = obj;
  objnew.x = objtmp.offsetLeft;
  objnew.y = objtmp.offsetTop;
  while ((objtmp = objtmp.offsetParent) != null) {
   objnew.x += objtmp.offsetLeft;
   objnew.y += objtmp.offsetTop;
  }
 } else if (document.layers) {
  objnew.x = document.anchors[elementname].x;
  objnew.y = document.anchors[elementname].y;
 } else {
  objnew.x = 0;
  objnew.y = 0;
 }
 return objnew;
}

-->
</SCRIPT>

<div id="box_title">

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

</div>

<div id="box_main">

<div class="entry_title_bg">
<div class="entry_title">{entry_title}</div>
</div>

<div class="entry">
<div class="entry_body">{entry_description}</div>
<div class="entry_more">{entry_sequel}</div>
<div class="entry_state">【{entry_date} {entry_time}】 author : {user_name} | {category_name} | {comment_num} | {trackback_num} |</div>
<a href="#" onClick="jumpToPageTop();return false;" onKeyPress="jumpToPageTop();return false;"><img src="http://mkdn.jugem.cc/?image=55" width="520" height="9" border="0"></a>
</div>
<div class="entry_state">{trackback_auto_discovery}</div>

<div class="entry_title_bg"><a name="comments"></a>
<div class="entry_title">コメント</div>
</div>

<div class="entry_body">{comment_description}</div>
<div class="entry_state">【{comment_time}】 {comment_name} |</div>

<table width="520" border="0" cellspacing="0" cellpadding="0" class="entrytable">
<tr>
<td class="entry_title_bg"><div class="entry_title">コメントする</div></td>
</tr>
<tr>
<td>
<div class="entry_body">
<form action="./?mode=comment" method="post">

<table width="490" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="220" valign="top">
<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}" style="width:220px;" />
<br />
<label for="email">email:</label><br>
<input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" style="width:220px;" />
<br />
<label for="url">url:</label><br>
<input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" style="width:220px;"/>
</td>
<td width="20">&nbsp;</td>
<td width="250" valign="top">
<label for="description">comments:</label><br />
<textarea tabindex="4" id="description" name="description" rows="10" cols="20" style="width:230px;"></textarea>
<br />
<br />
<input type="submit" value="　コメント送信　" name="submit" onmouseover="this.style.backgroundColor='#D73200'" onmouseout="this.style.backgroundColor='#8F0000'" STYLE="font-size:10px; font-weight:bold; height:20px; color:#E6E6E6; background-color:#8F0000;" />
<input type="checkbox" name="set_cookie" value="1" id="set_cookie">
<label for="set_cookie">Cookieに登録</label>
</td>
</tr>
</table>
</form>
</div>
</td>
</tr>
</table>

<div class="entry_title_bg"><a name="trackback"></a>
<div class="entry_title">この記事のトラックバックURL</div>
</div>

<div class="entry_body">{trackback_url}</div>

<div class="entry_title_bg">
<div class="entry_title">トラックバック</div>
</div>

<div class="entry_body">{trackback_title}</div>
<div class="entry_body">{trackback_excerpt}</div>
<div class="entry_state">【{trackback_time}】 {trackback_blog_name} |</div>

<div class="entry_title_bg">
<div class="entry_title">プロフィール</div>
</div>

<div class="entry">
<div class="entry_body">{profile_name}</div>
<div class="entry_body">{profile_description}</div>
</div>

</div>

<div id="box_side">

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">CALENDAR</div>
</td>
</tr>
<tr>
<td align="center">
<div class="calendar">
<table border="0" cellspacing="1" cellpadding="0">
<tr align="center">
<td class="cell_sun">S</td>
<td class="cell_week">M</td>
<td class="cell_week">T</td>
<td class="cell_week">W</td>
<td class="cell_week">T</td>
<td class="cell_week">F</td>
<td class="cell_sat">S</td>
</tr>
</table>
{calendar}
</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">NEW ENTRIES</div>
</td>
</tr>
<tr>
<td><div class="side_text">{latest_entry_list}</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">CATEGORIES</div>
</td>
</tr>
<tr>
<td><div class="side_text">{category_list}</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">ARCHIVES</div>
</td>
</tr>
<tr>
<td><div class="side_text">{archives_list}</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">RECENT COMMENT</div>
</td>
</tr>
<tr>
<td><div class="side_text">{recent_comment_list}</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">RECENT TRACKBACK</div>
</td>
</tr>
<tr>
<td><div class="side_text">{recent_trackback_list}</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">LINKS</div>
</td>
</tr>
<tr>
<td><div class="side_text">{link_list}</div></td>
</tr>
</table>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">PROFILE</div>
</td>
</tr>
<tr>
<td><div class="side_text">{user_list}</div></td>
</tr>
</table>

<form method="get" action="">

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">SEARCH</div>
</td>
</tr>
<tr>
<td>
<table width="180" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div class="search"><input id="search" name="search" size="20" style="width:140px" class="form" />
</div>
</td>
</tr>
<tr>
<td><div class="search"><input type="submit" value="　SEARCH　" onmouseover="this.style.backgroundColor='#D73200'" onmouseout="this.style.backgroundColor='#8F0000'" STYLE="font-size:10px; font-weight:bold; height:20px; color:#E6E6E6; background-color:#8F0000;" /></div></td>
</tr>
</table>
</td>
</tr>
</table>
</form>

<table width="200" border="0" cellspacing="0" cellpadding="0" class="linktable">
<tr>
<td class="side_title_bg">
<div class="side_title">RECOMMEND</div>
</td>
</tr>
<tr>
<td align="center">
<div class="side_text">

<div class="linktext">
{amazon_item}
</div>
 
</div>
</td>
</tr>
</table>

<div class="side_text">
<ul>
<li><a href="./?mode=rss">RSS1.0</a></li>
<li><a href="http://www.jugem.jp/">Powered by JUGEM</a></li>
</ul>
</div>

</div>

</body>
</html>

CSS

body {
margin: 0px;
padding: 0px;
color : #636363;
background-image: url(http://mkdn.jugem.cc/?image=41);
}

a:link {color:#FF0000; text-decoration:none;}
a:visited {color:#D39393; text-decoration:none;}
a:active {color:#FF0000; text-decoration:none;}
a:hover {color:#FF875C; text-decoration:none;}

#box_title {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 760px;
	height: 197px;
	background-image: url(http://mkdn.jugem.cc/?image=52);
}

#box_main {
	position: absolute;
	left: 20px;
	top: 242px;
	width: 520px;
	z-index: 0;
}

#box_side {
	position: absolute;
	left: 560px;
	top: 197px;
	width: 200px;
}

#box_moblog_nv {
	position: absolute;
	left: 650px;
	top: 15px;
	width: 88px;
	height: 35px;
}

#box_moblog {
	position: absolute;
	left: -230px;
	top: 242px;
	width: 230px;
	z-index: 1;
}

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

ul {
list-style-image:url(http://mkdn.jugem.cc/?image=49);
margin: 0px 0px 0px 20px;
padding: 0px;
}

.site_title {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 18px;
font-weight: bolder;
color: #FFFFFF;
margin: 115px 0px 0px 20px;
padding: 0px;
}

.site_title a,
.site_title a:link,
.site_title a:visited,
.site_title a:active,
.site_title a:hover {
color: #FFFFFF;
text-decoration:none;
}

.description {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 12px;
font-weight: bolder;
color: #FFFFFF;
margin: 5px 0px 0px 20px;
}

.entrytable {
margin: 9px 0px 20px 0px;
}

.entry {
margin: 0px;
padding: 5px 0px 0px 0px;
}

.entry_date {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
line-height: 150%;
color: #636363;
}

.entry_author {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
line-height: 150%;
color: #636363;
margin: 0px 0px 5px 0px;
padding-bottom: 5px;
border-bottom: dotted 1px #999999;
}

.entry_body {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 12px;
line-height: 150%;
color: #636363;
margin: 0px 0px 15px 10px;
}

.entry_more {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 12px;
line-height: 150%;
color: #636363;
margin: 0px 0px 5px 10px;
}

.entry_state {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
color: #636363;
margin: 0px 0px 30px 10px;
}

.pagetop_bg {
width: 520px;
background-image: url(http://mkdn.jugem.cc/?image=47) no-repeat;
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
line-height: 150%;
align: right;
}

.comment_title {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 14px;
font-weight: bolder;
color: #666666;
margin: 20px 0px 10px 0px;
padding-bottom: 3px;
border-bottom: 1px dotted #CCCCCC;
}

.trackback_title {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 14px;
font-weight: bolder;
color: #666666;
margin: 20px 0px 10px 0px;
padding-bottom: 3px;
border-bottom: 1px dotted #CCCCCC;
}

.entry_title {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 12px;
line-height: 150%;
font-weight: bolder;
color: #FFFFFF;
padding-top: 3px;
padding-left: 30px;
}

.entry_title_bg {
margin: 0px 0px 10px 0px;
width : 520px;
height : 21px;
background-image : url(http://mkdn.jugem.cc/?image=42);
}

blockquote {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
color: #006699;
margin: 20px 10px 20px 10px;
padding: 10px;
border: 1px dotted #999999;
}

.pict {
border-width: 1px;
border-style: solid;
border-color: #33CCFF;
}

.linktable {
margin: 0px 0px 20px 0px;
}

.side_title {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-weight: bolder;
font-size: 10px;
padding-left: 10px;
color: #FFFFFF;
}

.side_title_bg{
margin: 16px 0px 0px 0px;
width:200px;
height:23px;
background: url(http://mkdn.jugem.cc/?image=50) no-repeat;
}

.side_text {
width: 180px;
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
line-height: 150%;
color: #FFFFFF;
padding: 10px 0px 10px 15px;
}

.search {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
line-height: 150%;
color: #636363;
margin: 7px 0px 5px 10px;
}

.search_box {
margin: 0px 0px 5px 10px;
}

.copyright {
font-family: "Verdana", "Osaka","ＭＳ ゴシック","ヒラギノ角ゴ Pro W3";
font-size: 10px;
color: #636363;
padding: 15px 0px 25px 0px;
border-top: dotted 1px #636363;
}

.calendar {
	font-family: "Verdana";
	font-size: 10px;
	color: #8C5252;
	line-height: 180%;
	margin: 0px 0px 20px 0px;
	padding: 0px;
}

.calendar_month {
	font-family: "Verdana";
	font-size: 10px;
	color: #FFFFFF;
}

.today {
	font-size: 10px;
	color:#FFFFFF
	background: #740404;
	padding: 3px;
}

.cell {
	font-size: 10px;
	color: #8C5252;
	background: #5B0202;
	width:26px;
	height:22px;
	padding: 1px;
	margin: 0px;
}

.cell_sun {
	font-size: 10px;
	background: #5B0202;
	width: 26px;
	height: 20px;
	padding: 1px;
	color : #CC0000;
}
.cell_sat {
	font-size: 10px;
	background: #5B0202;
	width: 26px;
	height: 20px;
	padding: 1px;
	color : #0066CC;
}
.cell_week {
	font-size: 10px;
	background: #5B0202;
	width: 26px;
	height: 20px;
	padding: 1px;
	color : #FFFFFF;
}

input,textarea,select{
font-size :10px;
color :#333333;
}

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