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

ホーム

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

テンプレート名 : Dear**miyu

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}" /></head>
<body>

<img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090921_636106.gif" alt="" width="21" height="25" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090921_636106.gif" alt="" width="21" height="25" class="pict" /></div>
<img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296363.gif" alt="" width="120" height="175" class="pict" />{blog_name}</div>
<img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090921_636106.gif" alt="" width="21" height="25" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296365.gif" alt="" width="21" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20091016_1296366.gif" alt="" width="18" height="13" class="pict" /><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090921_636106.gif" alt="" width="21" height="25" class="pict" />
<div class=sited>{blog_description}</div></CENTER></div></TD></TABLE>
   <TABLE cellspacing="0" cellpadding="0" width=610>
<td width="400" valign=top align=left>
<div style="padding:4px;margin-bottom:6px;">

<div class="entry">
<div class="entry_title">
<CENTER><div style="width:90%;padding:5px;border:0px solid #fcd0d3;background-color:white<img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626127.gif" alt="" width="16" height="16" class="pict" /><BR>
{entry_title}</CENTER>
</div></div>
<div class="entry_body" style="padding:5px;margin:0px;">
{entry_description}
</div>
<a name="sequel"></a>
<div class="entry_more" style="text-align:left;background-color:white;">
{entry_sequel}</div>
<div align="center" class="entry_state" width=90%>
<font color=peachpuff>●</font> {category_name} <font color=pink>&hearts;</font> {entry_date} <font color=pink>&hearts;</font> {entry_time} <font color=pink>&hearts;</font> {comment_num} <font color=peachpuff>●</font></div></div>
{trackback_auto_discovery}</div>
<CENTER><HR size=1 width=90%></CENTER>
<CENTER>

<a name="comments"></a>
<div class="cmbody">
<div class="comment">Message</div>
<font size=1>

<div class="entry_body" align=left>
{comment_description}
</div>
<div class="comment_state" align="center" style="font-weight:normal;">
by.{comment_name}　{comment_time}
</div>

<div class="comment_form">
<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="7" cols="30" style="width:300px;"></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>
</font></CENTER>

<div class="entry">
{user_name}
<div class="entry_date">Profile</div>
<div class="entry_body">{profile_name}<br><br>{profile_description}</div>

</div>

<div class="entry_navi"><Div Align="center"><TABLE cellpadding=3><TD>{prev_page_link}</TD><TD><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626128.gif" alt="" width="16" height="16" class="pict" /></TD><TD>{page_now} / {page_num}</TD><TD><img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626127.gif" alt="" width="16" height="16" class="pict" /></TD><TD>{next_page_link}</TD></TABLE>
<img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626280.png" alt="" width="79" height="65" class="pict" />  <img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626220.png" alt="" width="31" height="31" class="pict" />  <img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626279.png" alt="" width="79" height="65" class="pict" />  <img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626219.png" alt="" width="31" height="31" class="pict" /> <img src="http://img-cdn.jg.jugem.jp/3c3/1439765/20090919_626285.png" alt="" width="79" height="65" class="pict" />

</div>
</td>

<td valign=top width="225">

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;"><img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>calendar</div></CENTER></div>
<div class="calendar" align="center">
<table border="0" cellspacing="1" cellpadding="0">
<tr>
<td class="weekday">S</td>
<td class="weekday">M</td>
<td class="weekday">T</td>
<td class="weekday">W</td>
<td class="weekday">T</td>
<td class="weekday">F</td>
<td class="weekday">S</td>
</tr>
</table>
{calendar}
</div>

<HR size=1 width=90%>
<div class="linktitle">
<CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;"><img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
profile</div></CENTER></div>
<div class="linktext">
{user_name}</div>
      </DIV></div>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>entry</div></div>
<div class="linktext">{selected_entry_list}</div></CENTER>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>category</div></CENTER></div>
<div class="linktext">
{category_list}
</div>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>archives</div></CENTER></div>
<div class="linktext">
{archives_list}</div>

<div class="linktitle"><CENTER><div style="width:90%;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>messages</div></CENTER></div>
<div class="linktext">
{recent_comment_list}
</div>

<HR size=1 width=90%>


<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
link</CENTER></div></div>
<div class="linktext">
{link_list}
</div>
<HR size=1 width=90%>


<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
{freespace_title1}</CENTER></div></div>
<div class="linktext">{freespace_contents1}</div>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;"><img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
{freespace_title2}</CENTER></div></div>
<div class="linktext">{freespace_contents2}</div>
<HR size=1 width=90%>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
{freespace_title3}</CENTER></div></div>
<div class="linktext">{freespace_contents3}</div>
<HR size=1 width=90%>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
{freespace_title4}</CENTER></div></div>
<div class="linktext">{freespace_contents4}</div>
<HR size=1 width=90%>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
{freespace_title5}</CENTER></div></div>
<div class="linktext">{freespace_contents5}</div>
<HR size=1 width=90%>

<div class="linktitle" style="margin-bottom:0px;"><CENTER><div style="width:90%;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>search</div></div>
<div class="linktext">

<form method="get" action="">
<input id="search" name="search" size="20" style="font-family:verdana;border:1px solid #fcd0d3;width:120px" class="form" />
<input type="submit" value="！" style="border:1px solid #fcd0d3;" class="button" />
</form>
</div>

<HR width=90% size=1>

<div class="linktitle"><CENTER><div style="width:90%;border:0px solid #fcd0d3;padding:5px;background-color:white;">
<img src=http://juillet.chu.jp/blog/point_ribbon09_03.gif style="margin:2px;"><BR>
powered</div></div></CENTER>
<div class="linktext" align=center>
{ad}
</div>
よく利用をさせてもらってる素材屋さま</div>
*SURE様*Juillet様*party様*amuca様*comiru様*etc...

{ad}

CSS

/* ブラウザのデフォルトに依存しないように全てのマージンとパディングを0にしています */
* {
	margin: 0;
	padding: 0
}

/* html（スクロールバーの色設定が反映されるのはIEのみ） */
html {
	scrollbar-face-color: #FAF0E6/* バーの色 */
	scrollbar-3dlight-color: #FFE0D8; /* 左上外側ライン */
	scrollbar-highlight-color: #FFE0D8; /* 左上内側ライン */
	scrollbar-shadow-color: #FFE0D8; /* 右下内側ライン */
	scrollbar-darkshadow-color: #FFE0D8; /* 右下外側ライン */
	scrollbar-arrow-color: #ffffff; /* 矢印 */
	scrollbar-track-color: #ffffff; /* トラック部分 */
}

/* ボディ */
body{     
          margin-bottom:0px ;
	/* サイト内の文字の設定をしています */
	text-align: left; /* 文字を左に設定 */
	line-height: 1.7; /* 文字間隔 */
         	font-size: 11px; /* 文字サイズ */
	font-family: Lucida Grande","Verdana","Osaka; /* 文字種類 */
	color: #F08080; /* 文字色  */

/* 背景を設定しています。画像を入れたい場合は、backgroundのurl()内の画像の参照先を変更してください */
	background: url() #FFE4E1;
}

/* リンク文字 */
a {
	text-decoration: none; /* 下線なし */
	color:#FFC0CB; /* 文字色 */
}

/* カーソルを置いたときのリンク文字 */
a:hover {
         color : #fff;
	background-color : #FFD0E0;
}

/* イメージにリンクを貼ったときの設定 */
a img {
	border : none; /* 線無し */
         
}

/*　文字間隔指定の際に発生するＩＥのバグ対策です　*/
br { letter-spacing : normal;

}

/* 入力エリア、リスト、ボタンの設定 */
input,textarea,select,button,submit {
	color: #836b4a; /* 文字色 */
	border: 1px solid #ffcccc; /* 線の色 */
         font-size:10px; /*文字の大きさ*/

/* 背景画像を設定しています。
背景を変えたい場合はbackgroundのurl()内を変更してください*/
	background: url(http://blog-imgs-30.fc2.com/s/u/s/susieq/back_dot12.gif) #ffffff;
}

/* テーブルセル全般の文字設定 */
th,td {
	vertical-align: top; /* 上寄せ */
}

/* 絵文字 */
img.emoji {
	vertical-align: middle; /* 上寄せ */
	border: 0; /* 線無し */
}

/*レイアウト設定----------------------------------------------*/

/* 外枠 */
#container {
	
	width: 690px; /* 外枠の幅 */
	margin:0 auto; /* 中央に設定 */

/* 背景を設定しています。外枠内に画像を入れたい場合は、backgroundのurl()内の画像の参照先を設定してください */
	background: url() #ffffff;
　　　　　border-right : 1px #d0bca9 solid;
        border-left : 1px #d0bca9 solid;
        background-color;
}

/* ヘッダー部分 */
#header {	
	width : 690px; /* ヘッダー部分の幅 */
	height: 235px; /* 高さを設定します */
	
/* トップ画像を変えたい場合は、backgroundのurl()内の画像の参照先を変更してください */
	background: url() #ffffff right top ;
}

/* 左メニューにしたい場合はメニュー部分（#menu）のleftをrightに、記事部分（#main）のrightをleftにしてください */

/* メニュー部分 */
#menu {
	float : left; /* 左寄せ */

/* 背景を設定しています。画像を入れたい場合は、backgroundのurl()内の画像の参照先を変更してください */
	background: url() #ffffff;
        
}

/* 記事部分 */
#main {
	float : right; /* 右寄せ */
         letter-spacing: 1px;

/* 背景を設定しています。画像を入れたい場合は、backgroundのurl()内の画像の参照先を変更してください */
	background: url() #ffffff;
}

/* フッター部分 */
#footer {
	width : 690px; /* フッター部分の幅 */
                height: 180px; /* 高さを設定します */
         	clear : both; /* 回り込み解除 */
	margin-top: 40px; /* 上との間隔を開けています */
	text-align: center; /* 文字を中央に設定 */
	/* 背景を設定しています。画像を入れたい場合は、backgroundのurl()内の画像の参照先を変更してください */
	background: url() #ffffff;
}

/*タイトル設定------------------------------------------------*/

/* ブログタイトル */
.blog_title {
	font-size: 500px; /* 文字サイズ */ 
               color: #FFE0D8; /* 文字色 */
         
                  	}

/* ブログタイトルリンク */
.blog_title a {
	text-decoration: none; /* 下線無し */
	color: #FFB6C1; /* 文字色 */
         
}

/* サブタイトル */
.sub_title {

color:#F08080; /* 文字色 */
}

/*メニュー部分設定--------------------------------------------*/

/* メニュー囲み */
.menu_block {
	width : 170px; /* メニューの枠の幅 */
	margin: 10px; /* 上右下左に間隔を取っています */
　　　　 line-height: 1.8; /* 文字間隔 */
         background: url() #ffffff no-repeat;
         padding: 5PX;

}

/* メニュータイトル */
.menu_title {
	padding-left: 10px; /* アイコンを入れるので左に間隔を取っています */　　
　　　　　color: #FFC0C0; /* 文字色 */
         font-weight: bold; /* 太字 */
         border-bottom: 2px dotted #FFD4D8; /* 下にラインを書いています */
}

/* メニューリスト親要素 */
ul {
	list-style-type: none; /* メニューリスト左に出る「・」を無くしました */
}

/*記事部分等設定----------------------------------------------*/

/* 記事部分等囲み */
.main_block {
	width : 450px; /* 記事部分の枠の幅 */
	margin: 10px; /* 上右下左に間隔を取っています */
         padding: 10PX 0PX 10PX 20PX;
         background: url() #ffffff no-repeat;

}

/* 記事部分等タイトル（アイコンを入れる場合はメニュータイトルを参考にしてください） */
.main_title {
	margin: 10px; /* 上下左右に間隔を取っています */
	font-size: 11px; /* タイトルなので文字を大きめにしました */
	font-weight: bold; /* 太字 */
　　　　　color:#F08080; /* 文字色 */
          border-bottom: 2px dotted #fbcac2; /* 下に点線を書いています */
　　　　         
     
}

.main_title a {
	text-decoration: none; /* 下線無し */
}

/* 記事部分等本文囲み */
.main_body {
	margin: 10px; /* 上下左右に間隔を取っています */
}

/* リンク文字 */
.main_body a {
	text-decoration: none; /* 下線なし */
	color: #ceb6d1; /* 文字色 */
}

/* カーソルを置いたときのリンク文字 */
.main_body a:hover {
         color : #fff;
	background-color : #FFD0E0;
}

/* 日付等のステータス */
.main_state {
	margin-right: 10px; /* 右に間隔を取っています */
	text-align: right; /* 文字右寄せ */
	font-size: 10px; /* 文字の大きさを少し小さめにしています */
}

/* コメント、トラックバック囲み */
.link_block {
	margin-bottom: 10px; /* 下に間隔を取っています */
	border-bottom: 1px dotted #eeeeee; /* 下に線を書いています */
}

/* コメント、トラックバックタイトル */
.link_title {
	font-weight: bold; /* 太字 */
}

/*その他------------------------------------------------------*/

/* ページ移動 */
.page_navi {
	width : 460px; /* ページ移動の枠の幅 */
	margin: 10px; /* 上下左右に間隔を取っています */
	text-align: center; /* 文字中央寄せ */
}

/* カレンダー設定 */

#calender {
	line-height: 1.9; /* 文字間隔 */
	font-size: 10px;
	letter-spacing: 0px;
	text-align: center;}

#calender ul {
	list-style-position : inside;}

#calender li {
	color: white;
	display : inline;
	list-style-type : none;}

li.day {
	padding: 0px 0px 0px 2px;
}

/* プラグインカレンダー設定 */

/* カレンダー枠テーブル */
table.calender {
	width: 170px;
}

/* リンク文字 */
table.calender a {
	text-decoration: none; /* 下線なし */
	color: #FFB6C1; /* 文字色 */

}

/* ヘッダー（年、月） */
.calender caption {
	font-size: 10px;
         color: #D8BFD8;
	border-bottom: 1px solid #; /* 下にラインを書いています */

}

/* 曜日セル */
.calender th {
	font-weight: normal;
	text-align: center;
         color: #D8BFD8;
}

/* 日付セル */
.calender td {
	text-align: center;
         color: #D8BFD8;
         padding:1px 1px 1px 1px ;
        background:url(http://blog-imgs-30.fc2.com/s/u/s/susieq/heart_bg1.gif) center no-repeat ;

}

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