3コラム(黒背景用)

黒背景用のテンプレートです。お好みのタイトルやアイコンに変更してお使い下さい。

  サンプル  

◆テンプレ使用素材◆
タイトル背景 760×130

萩と月

日付用アイコン 60×60
萩と月のアイコン

◆ご利用方法◆
下のタグをメモ帳などにコピーし、赤字の2箇所の画像のアドレスを変更してお使い下さい。
例: ● 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:#FFF;                  
 /*記事のフォントの色*/
font-family:arial ,sans-serif;
background-color:#000000;
text-align:center;

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

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


#header{
background-color:#transparent;
}
#header td{
color:#666;
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-K1.jpg) no-repeat 50% 0; /*タイトル背景*/
}

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

#blogcontainer{
width:765px;
margin:10px auto 0;
padding-bottom:30px;
background-color:#000;
}

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

.datetop,#articletop{
padding:3px 0px;
background-color:#336633;
}

.fullbody,#articlebody{
background-color:#000; 
padding:5px 15px 5px 15px;
margin:0px 0px 10px 0px;
}

.date{
padding:30px 60px;
color:#669966;
font-size:12px;
font-weight:bold;
background:url(
http://○○○○○○○/a-hagi-tuki.gif) no-repeat no-repeat 0% 50%;  /*日付アイコン画像*/

width:100%;
}

.blogbodytop{}

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

.title{
color:#999933;
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 #999;
padding:10px;
margin:10px;
text-align:left;
}

.pict{}

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

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

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

.nextpage{
font-size:12px;
padding:5px;
text-align:right;
}
.nextpage a:link{color:#fff;}
.nextpage a:visited{color:#fff;}
.nextpage a:active{color:#fff;}
.nextpage a:hover{color:#fff;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:#fff;font-weight:bold;}
.menu a:visited{color:#fff;font-weight:bold;}
.menu a:active{color:#fff;font-weight:bold;}
.menu a:hover{color:#fff;font-weight:bold;text-decoration:none;}

.comblogbodybottom{}

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

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

.trackbackhead,.commenthead,.takecommenthead{
color:#4e78ad;
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:#fff;
font-size:12px;
margin:15px 0;
}

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

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

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

#formbody{
text-align:center;
}

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

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

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

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

.caltblwkbg{}
.caltblwk{
color:#999933;
font-size:12px;
}
.caltblwk td{
padding:3px 0;
text-align:center;
background:#000;
border:solid #999;
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:#cccc99;
border:solid #999;
border-width:0 1px 1px 0;
}

.calon{}
.caloff{}

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


.sidetitle{ /*メニュータイトル*/
color:#999933;
font-size:12px;
font-weight:bold;
text-align:center;
margin-bottom:5px;
}

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

.sidebody{
margin-bottom:5px;
}

.sidebody a:link{color:#fff;}
.sidebody a:visited{color:#fff;}
.sidebody a:active{color:#fff;}
.sidebody a:hover{color:#fff;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:#fff;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:#fff;}
.afbody a:visited{color:#fff;}
.afbody a:active{color:#fff;}
.afbody a:hover{color:#fff;}

.afbody img{margin-bottom:3px;}
.photo{text-align:center;}
.nickname{color:#fff;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:#000;}

.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:#fff;font-weight:bold;text-decoration:underline;}
a.adtitle:visited{color:#fff;font-weight:bold;text-decoration:underline;}
a.adtitle:active{color:#fff;font-weight:bold;text-decoration:underline;}
a.adtitle:hover{color:#fff;font-weight:bold;text-decoration:underline;}

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

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

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

body.ad{background:#000;
}

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


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

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