3コラム(壁紙背景タイプ)

淡い色や小さなイラストの壁紙を選んで、差し替えてお使い下さい。

3コラムサンプル

◆テンプレ使用素材◆

タイトル背景 760×130

萩とうさぎ

壁紙 1000×200 (横長タイプなら、違うサイズの素材でも修正せずに変更できます)

霞

背景 760×200
萩
メニュー用バナー 179×30       日付用アイコン 60×45
うさぎのアイコン     桔梗のアイコン


◆ご利用方法◆
下のタグをメモ帳などにコピーし、赤字の5箇所の画像のアドレスを変更してお使い下さい。
例: ● 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:url(
http://○○○/kasumi-1.jpg) repeat-y 50% 0;  /*壁紙*/
text-align:center;
     
/*スクロールバーの色指定*/
  scrollbar-arrow-color:#bfd0dd; 
  scrollbar-base-color:#ffffff;   
  scrollbar-face-color:#ffffff;  
  scrollbar-highlight-color:#bfd0dd; 
  scrollbar-3d-light-color:#bfd0dd; 
 scrollbar-shadow-color:#bfd0dd;   
}

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://○○○/hagi_usagi760-1.jpg) no-repeat 50% 0; /*タイトル背景*/
}

#banner a{color:#308aaa;}
#banner a:link{color:#308aaa;}
#banner a:visited{color:#308aaa;}
#banner a:hover{color:#308aaa;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:#308aaa;
text-align:center;
margin:-35 auto;
}

#blogcontainer{
width:765px;
margin:10px auto 0;
padding-bottom:30px;
background:url(
http://○○○/hagi-k2-765.jpg) repeat-y 50% 0;  /*記事背景*/
}

#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:#308aaa;
font-size:12px;
font-weight:bold;
padding:10px;
margin:0px auto 10px;
text-align:center;
background-color:#bfd0dd;  
}

.datetop,#articletop{
padding:3px 0px;
background-color:#bfd0dd;
}
.fullbody,#articlebody{
background-color:#
dfe8ee;   /*記事背景色の変更*/
padding:5px 15px 5px 15px;
margin:0px 0px 10px 0px;
}
.date{
padding:20px 60px;
color:#4e78ad;
font-size:12px;
font-weight:bold;
background:url(
http://○○○/ta-kikyo-1.gif) no-repeat 0% 50%;   /*日付アイコン画像*/

width:100%;
}

.blogbodytop{}

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

.title{
color:#231a5e;
font-size:13px;
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 #fdc1e7;
padding:10px;
margin:10px;
text-align:left;
}

.pict{}

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

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

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

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

.blogbodybottom{
     margin-bottom:10px;
}

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

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

.comblogbodybottom{}

.trackbackurltop,#trackbacktop,#commenttop,.formbodytop{}
.trackbackurlbody{
padding:10px 0px;
text-align:left;
width:100%;
}
.trackbackurlttl{
color:#231a5e;
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:#233a58;}
a.posttitle:visited{color:#233a58;}
a.posttitle:active{color:#233a58;}
a.posttitle:hover{color:#233a58;text-decoration:none;}

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

.trackbackhead,.commenthead,.takecommenthead{
color:#231a5e;
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:#233a58;}
.loginon a:visited{color:#233a58;}
.loginon a:active{color:#233a58;}
.loginon a:hover{color:#233a58;}

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

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

#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:#666;
font-size:12px;
font-weight:bold;
text-align:center;
padding:5px 0 5px;
background:url() no-repeat 50% 0%;
}

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

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

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

.caltblwkbg{}
.caltblwk{
color:#fff;
font-size:12px;
}
.caltblwk td{
padding:3px 0;
text-align:center;
background:#426fae;
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:#608aaa;
font-size:12px;
font-weight:bold;
text-align:center;
padding:10px 0px 18px 0px;
background:url(
http://○○○/l-usagi.jpg) no-repeat 50% 0%;    /*メニュー用バナー*/
}

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

.sidebody{
margin-bottom:5px;
}

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

.sidebottom{}

a.ttllink:link{color:#fff;text-decoration:underline;}
a.ttllink:visited{color:#fff;text-decoration:underline;}
a.ttllink:active{color:#fff;text-decoration:underline;}
a.ttllink:hover{color:#CCC;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:#d872ef;}
.afbody a:visited{color:#d872ef;}
.afbody a:active{color:#d872ef;}
.afbody a:hover{color:#d872ef;}

.afbody img{margin-bottom:3px;}
.photo{text-align:center;}
.nickname{color:#233a58;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:#233a58;font-weight:bold;text-decoration:underline;}
a.adtitle:visited{color:#233a58;font-weight:bold;text-decoration:underline;}
a.adtitle:active{color:#233a58;font-weight:bold;text-decoration:underline;}
a.adtitle:hover{color:#233a58;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:#233a58;text-decoration:underline;}
a.adld:visited{color:#233a58;text-decoration:underline;}
a.adld:active{color:#233a58;text-decoration:underline;}
a.adld:hover{color:#233a58;text-decoration:underline;}

body.ad{background:#dbe9f3;
}

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


トップページ > サイトメニュー >  ブログ素材 > 3コラム(壁紙タイプ)

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