3コラム・スクロールバー付き(茶色の)

サンプル    


◆テンプレ使用素材◆

タイトル背景  760×130 minori760-1.jpg

秋の実り

記事背景 765×40 k-5.gif



メニュー用アイコン 55×40 日付用アイコン 60×60
ta-buru_bery.gif a-kuri-1.gif
ブルーベリー 栗

◆ご利用方法◆
下のタグをメモ帳などにコピーし、赤字の4箇所の画像のアドレスを変更してお使い下さい。
例: ● http://ご自分のURLアドレス/minori760-1.jpg

画像をアップロードします。

テンプレートのシンプルから3カラムを選び(デフォルトなど)、デザインを変更して「すべてのページ」を再構築ます。

「スタイルシート(CSS)」のタグを全て消して、
画像のアドレスを修正したタグを、コピー&貼り付けをします。

この内容で保存する

ブログに設定を反映(再構築)

※2コラムから3コラムに変更した時は、プラグインの位置(A・B)を修正します。
※記事BOXにスクロールバーを入れたくない時は下のタグを削除して下さい。

height:1000px;   /*スクロールする記事Boxの長さ:任意で変更*/
overflow:scroll;                                

◆下のタグの簡単なコピーのしかた◆
下のタグの最初の文字の前でクリックし、そのまま画面をスクロールして最後の文字の後を「Shift」を押しながら
クリックします。タグが黒く反転したら、右クリックでコピーし、メモ帳などに右クリック・貼り付けします。
Macユーザーさんは「コマンド+C」でコピー、「コマンド+V」でペーストして下さい。

@charset "EUC-JP";

/*
-----------------------------------------------------
livedoor Blog CSS
3コラム(秋の味覚)
Designed by mugenka
-----------------------------------------------------
*/

body{
margin:0;
padding:0;
color:#333;
font-family:arial ,sans-serif;
background-color:#cc9966;
text-align:center;

/*スクロールバーの色指定*/
  scrollbar-arrow-color:#cc9966; 
  scrollbar-base-color:#cc9966;   
  scrollbar-face-color:#ffffff;  
  scrollbar-highlight-color:#ffffff; 
  scrollbar-3d-light-color:#cc9966; 
  scrollbar-shadow-color:#cc9966;   
}

a:link{color:#233a58;}
a:visited{color:#233a58;}
a:active{color:#233a58;}
a:hover{color:#233a58;text-decoration:none;}


#header{
background-color:#transparent;
}
#header td{
color:#333;
font-size:12px;
text-align:right;
padding-right:10px;
}
#header a:link{}
#header a:visited{}
#header a:active{}
#header a:hover{text-decoration:none;}

#container{
width:786px;
margin:0 auto;
text-align:center;
word-break:break-all;
background-color:#transparent;
}

#banner{
width:760px;
height:130px;
text-align:center;
margin:5 auto;
background:url(
http://○○○○○○/minori760-1.jpg) no-repeat 50% 0;    /*タイトル背景画像*/
}


#banner a{color:#bf8040;}
#banner a:link{color:#bf8040;}
#banner a:visited{color:#bf8040;}
#banner a:hover{color:#bf8040;text-decoration:underline;}

h1,h2,h3{margin:0;padding:0;}

.blogtitle{
font-size:20px;
text-align:center;
margin:40 auto;
}

.description{
font-size:14px;
font-weight:bold;
color:#bf8040;
text-align:center;
margin:-35 auto;
}

#blogcontainer{
width:765px;
margin:10px auto 0;
padding-bottom:30px;
background:url(
http://○○○○○○/k-5.gif) repeat-y 50% 0;     /*Blogボディ画像*/
}

#wrapper{
width:585px;
float:left;
text-aling:center;
}

#content{
width:405px;
float:right;
text-aling:center;
}

#blog{
width:395px;
margin:0 auto;
text-align:left;
height:
1000px;   /*スクロールする記事Boxの長さ:任意で変更*/
overflow:scroll;
}

#lefttop,#righttop{}

#left{
width:180px;
float:right;
text-align:center;
}

#right{
width:180px;
float:left;
text-align:center;
}

#categorytitle{
color:#bf8040;
font-size:12px;
font-weight:bold;
padding:5px;
margin:0px auto 10px;
text-align:center;
background-color:#transparent;
}

.datetop,#articletop{
padding:3px 0px;
background-color:#bf8040;
}
.fullbody,#articlebody{
         background-color:#fff;
padding:5px 15px 5px 15px;
margin:0px 0px 10px 0px;
} /*記事BOXの指定*/
.date{
padding:30px 60px;
color:#bf8040;
font-size:12px;
font-weight:bold;
background:url(
http://○○○○○○/a-kuri-1.gif) no-repeat 0% 50%;   /*日付アイコン画像*/

width:100%;
}

.blogbodytop{}

.blogbody{
padding:10px 0px;
width:100%;
}

.title{
color:#bf8040;
font-size:14px;
font-weight:bold;
}

/*\*/
* html .main{height:1%;}
* html .mainmore{height:1%;}
/**/

.main,.mainmore{
font-size:12px;
text-align:left;
line-height:125%;
padding:15px 0px;
}

blockquote{
border:2px dotted #333;
padding:10px;
margin:10px;
text-align:left;
}

.pict{}

a.continues:link{color:#333;}
a.continues:visited{color:#333;}
a.continues:active{color:#333;}
a.continues:hover{color:#333;text-decoration:none;}

.posted{
font-size:11px;
text-align:right;
padding-top:5px;
}

.posted a:link{color:#333;}
.posted a:visited{color:#333;}
.posted a:active{color:#333;}
.posted a:hover{color:#333;text-decoration:none;}

.nextpage{
font-size:12px;
padding:5px;
text-align:right;
}
.nextpage a:link{color:#333;}
.nextpage a:visited{color:#333;}
.nextpage a:active{color:#333;}
.nextpage a:hover{color:#333;text-decoration:none;}

.blogbodybottom{
     margin-bottom:10px;
}

.menu{
font-size:11px;
text-align:right;
margin-top:5px;
background-color:#transparent;
padding-bottom:5px;
}

.menu a:link{color:#333;font-weight:bold;}
.menu a:visited{color:#333;font-weight:bold;}
.menu a:active{color:#333;font-weight:bold;}
.menu a:hover{color:#333;font-weight:bold;text-decoration:none;}

.comblogbodybottom{}

.trackbackurltop,#trackbacktop,#commenttop,.formbodytop{}
.trackbackurlbody{
padding:10px 0px;
text-align:left;
width:100%;
}
.trackbackurlttl{
color:#333;
font-size:12px;
font-weight:bold;
}

.trackbackurl{text-align:center;}
.trackbackurl table{width:335px;margin:10px auto 0;}
input.trackbackbox{width:260px;}

.trackbackurlbottom,#trackbackbottom,#commentbottom,.formbodybottom{}

a.posttitle:link{color:#333;}
a.posttitle:visited{color:#333;}
a.posttitle:active{color:#333;}
a.posttitle:hover{color:#333;text-decoration:none;}

#trackback,#comment,#takecomment{
padding:10px 0px;
text-align:left;
width:100%;
}

.trackbackhead,.commenthead,.takecommenthead{
color:#333;
font-size:12px;
font-weight:bold;
}
#trackbackbody,#commentbody,#takecommentbody{
padding:10px 5px;
}
.trackbackttl,.commentttl{
font-size:12px;
}
.trackbacktext,.commenttext{
font-size:12px;
margin:3px 0 10px 10px;
}

.loginon{
color:#333;
font-size:12px;
margin:15px 0;
}

.loginon a:link{color:#333;}
.loginon a:visited{color:#333;}
.loginon a:active{color:#333;}
.loginon a:hover{color:#333;}

.loginoff{
color:#333;
font-size:12px;
margin:15px 0;
}

.loginoff a:link{color:#333;}
.loginoff a:visited{color:#333;}
.loginoff a:active{color:#333;}
.loginoff a:hover{color:#333;}

#formbody{
text-align:center;
}

.form{
color:#333;
margin:0px auto;
font-size:12px;
}

.form th{
font-weight:normal;
padding:2px;
text-align:right;
}
.form td{
padding:2px;
}

input#author{width:200px;}
input#email{width:200px;}
input#url{width:200px;}
input#bake{}
textarea#text{width:320px;height:200px;}
input.button{margin-top:20px;width:80px;}

.formbodybottom{}

.calendarhead{
color:#333;
font-size:12px;
font-weight:bold;
text-align:center;
padding:5px 0 5px;
background:url() no-repeat 50% 0%;
}

.calendarhead a:link{color:#333;}
.calendarhead a:visited{color:#333;}
.calendarhead a:active{color:#333;}
.calendarhead a:hover{color:#333;text-decoration:none;}

.calendarpre,.calendarnext{
font-size:11px;
}

.caltop{}
.calbody{}
.caltbl{
width:170px;
margin:0 auto 30px;
border:solid #fff;
border-width:1px 0px 0px 1px;
}

.caltblwkbg{}
.caltblwk{
color:#fff;
font-size:12px;
}
.caltblwk td{
padding:3px 0;
text-align:center;
background:#6f8040;
border:solid #e3dac3;
border-width:0 1px 1px 0;
}

.weekday{}
.sun{}
.sat{}

.caltbldaybg{}

.caltblday{
font-size:11px;
color:#000;
}

.caltblday td{
text-align:center;
padding:3px 0px;
background:#fff;
border:solid #e3dac3;
border-width:0 1px 1px 0;
}

.calon{}
.caloff{}

.caltblday a:link{color:#233a58;font-weight:bold;}
.caltblday a:visited{color:#233a58;font-weight:bold;}
.caltblday a:active{color:#233a58;font-weight:bold;}
.caltblday a:hover{color:#233a58;font-weight:bold;text-decoration:none;}

.calbottom{}

.sidetitle{
color:#bf8010;
font-size:12px;
font-weight:bold;
text-align:center;
padding:15px 5px;
background:url(
http://○○○○○○/ta-buru_bery.gif) no-repeat left bottom 50% 0%;    /*メニュー画像*/
}

.side{
font-size:12px;
text-align:left;
line-height:125%;
padding:0 5px;
margin-left:5px;
margin-bottom:30px;
}

.sidebody{
margin-bottom:5px;
}

.sidebody a:link{color:#333;}
.sidebody a:visited{color:#333;}
.sidebody a:active{color:#333;}
.sidebody a:hover{color:#333;text-decoration:none;}

.sidebottom{}

a.ttllink:link{color:#333;text-decoration:underline;}
a.ttllink:visited{color:#333;text-decoration:underline;}
a.ttllink:active{color:#333;text-decoration:underline;}
a.ttllink:hover{color:#333;text-decoration:none;}

input.sf{width:100px;margin:5px 3px 5px 0;}
input.sfbtn{margin:5px 0;}
.moblogbody,.linkme,.skypeme{text-align:center;}
.afbody{text-align:center;padding-bottom:10px;}

.afbody a:link{color:#333;}
.afbody a:visited{color:#333;}
.afbody a:active{color:#333;}
.afbody a:hover{color:#333f;}

.afbody img{margin-bottom:3px;}
.photo{text-align:center;}
.nickname{color:#333;font-size:12px;font-weight:bold;padding:10px 0;}
.message{font-size:12px;padding-bottom:10px;}
.blogtimes{margin:10px auto;text-align:center;width:180px;}
.quotetable{background:#000;width:170px;}
.quotetable img{width:160px;}
.quote{color:#000;font-size:12px;padding:1px;background:#fff;}

.elsehead{}
.elsebody{
text-align:center;
}
.elsebottom{}
.checkers{padding-bottom:10px;width:117px;font-size:10px;text-align:left;margin:0 auto;}
.reader{padding-bottom:20px;width:117px;font-size:10px;text-align:left;margin:0 auto;}
.powered{padding-bottom:10px;}
.syndicate{}

#footer{}

.blogbody iframe{width:365px;margin-top:20px;}

a.adtitle:link{color:#333;font-weight:bold;text-decoration:underline;}
a.adtitle:visited{color:#333;font-weight:bold;text-decoration:underline;}
a.adtitle:active{color:#333;font-weight:bold;text-decoration:underline;}
a.adtitle:hover{color:#333;font-weight:bold;text-decoration:underline;}

a.addescription:link{color:#333;text-decoration:none;}
a.addescription:visited{color:#333;text-decoration:none;}
a.addescription:active{color:#333;text-decoration:none;}
a.addescription:hover{color:#333;text-decoration:none;}

a.adurl:link{color:#333;text-decoration:none;}
a.adurl:visited{color:#333;text-decoration:none;}
a.adurl:active{color:#333;text-decoration:none;}
a.adurl:hover{color:#333;text-decoration:none;}

a.adld:link{color:#333;text-decoration:underline;}
a.adld:visited{color:#333;text-decoration:underline;}
a.adld:active{color:#333;text-decoration:underline;}
a.adld:hover{color:#333;text-decoration:underline;}

body.ad{background:#fff;}

文章・テンプレートの無断使用・転載は一切禁止


トップページ > サイトメニュー >  ブログ素材 > 3コラム(茶色ベース)

季節の素材 夢幻華亭
Copyright(c) mugenka_tei All Rights Reserved since 2003