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

ホーム

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

テンプレート名 : boy

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

<body>

<div id="header">

<h1>{blog_name}</h1>
  <p>　{blog_description}</p>

<div id="calender"><p>{calendar_horizontal_addzero}</p></div>

</div>

<div id="frame">

<p class="navi">{prev_entry} | <a href="../.">main</a> | {next_entry} </p>
    
    
    <p class="navi">{prev_page_link} | {page_now}/{page_num}ページ | {next_page_link}</p>

<div class="entry">
    
      <p class="f1"><img src="http://img-cdn.jg.jugem.jp/fdd/671678/20080630_461810.gif" width="400" height="10" /></p>
      
      <div class="m2">
        
        <h3><a href="{entry_permalink}">{entry_title}</a></h3>

<p class="day">{entry_date}</p>

<div class="entry_body">{entry_description}</div>
              
        <a name="sequel" id="sequel"></a>
              
        <p class="entry_more">{entry_sequel}</p>
        
        <div class="entry_state">{trackback_auto_discovery}</div>
    
        <p class="entry_link">{category_name} | {entry_time} | {comment_num} | {trackback_num}</p>

</div>
    <p class="f1"><img src="http://img-cdn.jg.jugem.jp/fdd/671678/20080630_461811.gif" width="400" height="10" /></p>
    </div>

<div class="m2">
    
      
      <a name="comments" id="comments"></a>
                    
      <p class="entry_date">この記事に関するコメント</p>
            
      
      <div class="entry_body"> {comment_description} </div>
      <div class="entry_link"> {comment_name} | {comment_time} </div>
      
      <p class="entry_date">コメントする</p>
      
      <div class="entry_body">
        <form 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:300px;"></textarea><br />
          <br />
          <input type="submit" value="コメント送信" />
          <input type="checkbox" name="set_cookie" value="1" id="set_cookie"><label for="set_cookie" class="f1">Cookieに登録</label>
        </form>
      </div>
      
          
      
      <a name="trackback" id="trackback"></a>
      
      <p class="entry_date">この記事のトラックバックURL</p>

<div class="entry_body"><input name="text" type="text" style="width: 300px;" value="{trackback_url}" /></div>
      
      <p class="entry_date">トラックバック</p>
      
      <div class="entry_title">{trackback_title}</div>
      <div class="entry_body">{trackback_excerpt}</div>
      <div class="entry_link">{trackback_blog_name} | {trackback_time} </div>

<p class="entry_date">プロフィール</p>
      <div class="entry_title">{profile_name}</div>
      <div class="entry_body">{profile_description}</div>
      
      
        
    </div>

</div>
  
  <div id="left"><div id="margin1">

<h4><img src="http://blog.webms.jp/images/me1.gif" alt="カテゴリー" width="66" height="16" /></h4>
    <div class="linktext">{category_list}</div>

<h4><img src="http://blog.webms.jp/images/me3.gif" alt="新着" width="78" height="16" /></h4>
    <div class="linktext">{latest_entry_list}</div>

<h4><img src="http://blog.webms.jp/images/me4.gif" alt="月別" width="58" height="16" /></h4>
    <div class="linktext">{archives_list}</div>
    
    
    
    <h4><img src="http://blog.webms.jp/images/me5.gif" alt="コメント" width="75" height="16" /></h4>
    <div class="linktext">{recent_comment_list}</div>
    
  
    
    <h4><img src="http://blog.webms.jp/images/me6.gif" alt="トラックバック" width="72" height="16" /></h4>
    <div class="linktext">{recent_trackback_list}</div>
    
    
    
    <h4><img src="http://blog.webms.jp/images/me7.gif" alt="リンク" width="31" height="16" /></h4>
    <div class="linktext">{link_list}</div>
    
    
    
    <h4><img src="http://blog.webms.jp/images/me8.gif" alt="プロフィール" width="41" height="16" /></h4>
    <div class="linktext">{user_list}</div>

<h4><img src="http://blog.webms.jp/images/me12.gif" alt="登録" width="80" height="16" /></h4>
    <div class="linktext">
      <ul>
        <li><a href="./?mode=rss" target="_blank">RSS1.0</a></li>
        <li><a href="./?mode=atom" target="_blank">Atom0.3</a></li>
        <li><a href="#" onclick="window.external.AddFavorite('http://blog.webms.jp/','webmsA blog'); return false;">お気に入りに登録</a></li>
      </ul>
    </div>

<form method="get" action="">
    <h4><img src="http://blog.webms.jp/images/me9.gif" alt="webmsA blog 検索" width="48" height="16" /></h4>
    <input id="search" name="search" size="20" style="width:120px;" class="form" />
    <input type="submit" value="検索" style="height:20px;font-size:84%;" />
    </form>

<h5>Sponsored links</h5>
    {ad}
    
        
  </div></div>

<hr />

</div>

<div id="footer">
  <p>Copyright &copy;2008, <a href="http://webms.jugem.jp/" target="_blank">webms</a>. All rights reserved.</p>
</div>

CSS

@charset "EUC-JP";

/* 初期化
------------------------------------------------------------ */

/* ブラウザスタイルの初期化 */

*{
  margin:0;
  padding:0;
  color:#333333;
  font-size:100%;
  font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

/* (IE6など一部ブラウザ向け) */

th,td,form,ul,li{
  margin:0;
  padding:0;
  color:#333333;
  font-size:100%;
  font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

/* 初期設定
-------------------- */

/* font */

p,ul li,ol li,td,th,dt,dd,h3{
  font-size:84%;
  font-weight:normal;
  line-height:140%;
  letter-spacing:0.1em;
}

/* link */

/* 文字の色 */
a{ 
  color:#1D2088;
  text-decoration:underline;
  /*HideMacIE\*/
  overflow:hidden;
  /**/
}

/* 訪問済み */
a:visited{ 
  color:#1D2088;
  text-decoration:underline;
}

/* オンマウス時 */
a:hover{
  /*color:#cccccc;
  text-decoration:underline;*/
  background-color:#1D2088;
  color:#ffffff;
}

/* クリック時 */
a:active{
  color:#ffffff;
  text-decoration:underline;
}

/* 画像 */

img{
  border:0;
  border: none;
  vertical-align:top;
}

/* scroll bar */

html{
  scrollbar-arrow-color:#1D2088;
  scrollbar-highlight-color:#1D2088;
  scrollbar-shadow-color:#1D2088;
  scrollbar-3dlight-color:#ffffff;
  scrollbar-darkshadow-color:#ffffff;
  scrollbar-face-color:#ffffff;
  scrollbar-track-color:#ffffff;
}

/* line */

hr{
  clear:both;
  visibility:hidden;
  height:0;
}

/* list */

ul{
  list-style-type:none;
}

/* 枠組み
------------------------------------------------------------ */

#frame{
  width:600px;
	margin:0 auto;
}

#contents,#left{float:left;}

#contents{width:400px;}

#left{width:200px;}

#left #margin1{
  margin:0 0 0 40px;
}

/* header
------------------------------------------------------------ */

#header{
  text-align:center;
	background:url(http://img-cdn.jg.jugem.jp/fdd/671678/20080630_461804.gif) repeat-x left bottom;
	padding:20px 0 0 0;
	margin:0 0 20px 0;
}

#header h1,
#header p{display:inline;}

#header h1 a{text-decoration:none;}

#header p{
  color:#666666;
	font-size:70%;
}

#calender{padding:15px 0 5px 0;}

/* contents
------------------------------------------------------------ */

#contents p.navi{
  font-size:70%;
}

#contents div.entry{
  background:url(http://img-cdn.jg.jugem.jp/fdd/671678/20080630_461812.gif) repeat-y 0 0;
  margin:20px 0;
}

#contents p.f1{
  letter-spacing:0;
  line-height:0;
  font-size:0;
}

div.entry h3{
  text-align:center;
  font-weight:bold;
}

div.m2{margin:0 20px;}

div.entry h3 a{text-decoration:none;}

div.entry h3 a:hover{
  color:#1D2088;
	background-color:#FFFFFF;
}

p.day{
  text-align:center;
  font-size:70%;
  color:#666666;
}

.entry_body , .entry_more{
  font-size:84%;
  line-height:140%;
}

.entry_title, .entry_state{
  font-size:84%;
  letter-spacing:0.1em;
  line-height:140%;
}

.entry_link{
  font-size:70%;
  margin:20px 0;
}

.pageTop{
  font-size:70%;
  text-align:center;
  margin:5px 0;
}

.entry_date{
  border-bottom:#1D2088 1px solid;
  margin:10px 0;
}

.entry_title{margin:0 0 5px 0;}

/* left
------------------------------------------------------------ */

#left h4{
  margin:10px 0;
  line-height:0;
  letter-spacing:0;
  font-size:0;
}

#left h5{margin:10px 0;}

#left .linktext ul{
  list-style-image:url(http://img-cdn.jg.jugem.jp/fdd/671678/20080630_461813.gif);
  margin:0 0 0 20px;
}

#left .linktext ul li,#left p{
  font-size:70%;
	margin:0 0 3px 0;
}

#left .calendar table{
  width:160px;
}

#left p{margin:10px 0;}

/* footer
------------------------------------------------------------ */

#footer{
  background:url(http://img-cdn.jg.jugem.jp/fdd/671678/20080630_461806.gif) repeat-x left top;
}

#footer p{
  text-align:center;
	padding:5px 0 10px 0;
	font-size:70%;
}

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