ブログテンプレート2

先日公開したスタイルシートを使ってくださってる方をぽろぽろと見かけてこっそり喜んでいるLabであります。その直後「男の人でも使えそうな色違いがほしい」というリクエストメッセも頂いていたのですがなんだかんだで遅くなってしまいました。まだ見ていらっしゃいましたらこちらをお使いくださいです。


無難に青系いっときました。
以下簡単な注意事項(前回のものコピペ)。

元々のテンプレートは保存しておくことをお勧めします。簡単なので誰でもできると思いますが自己責任ということでよろちく。
基盤はソラマメで用意されている2カラムのシンプルテンプレート(幅固定バージョン)です。
3カラムや幅100%タイプのものには使えません。
サンプル：http://labtemp.slmame.com/

スタイルシートは追記に記載してありますがメモ帳などに一旦コピペして140行目にタイトル画像のURLを記入してください。(行数表示のあるエディタを使用すると楽ちん)
タイトル画像は縦210ピクセル×横740ピクセル。これ以上大きければとりあえずは問題ないはず。
またタイトル画像の色合いによってはブログタイトル部分の文字が見えにくくなる可能性があるので144行目から148行目のブログタイトルの文字色、164行目のブログ説明文文字色のカラーコードを変更してください。

後は以下の手順です。

1・シンプルテンプレート 2カラムの中から適当に選択(色はどれでもいいです)
2・テンプレートのカスタマイズ画面から「スタイルシート」の部分のみをタイトルURL部分を修正したものと丸々入れ替える。
3・テンプレートを反映させる。

これだけです。

CSSの知識のある方なら色変更は簡単だと思うのでがつがつ変えてください。とゆか知識ある人はこんなしょぼいの使わないか･･･。

あ、あと本文中の画像にはスタイルシートで枠がつくようにしているので画像の横幅は490ピクセル以下にしたほうがキレイだと思います。はい。

@charset "UTF-8";

*{
font-family :"verdana","helvetica","osaka","ＭＳ Ｐゴシック",ans-serif;
}

textarea,select,input {
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro","Osaka","Verdana","Helvetica","Arial","ＭＳ Ｐゴシック","sans-serif";
}

body{
color :#222222;
margin :0px;
background :#A9AFAF;/*背景色を指定*/
text-align:center;
}


form{
margin :0px;
padding :0px;
}

table.form{
margin :25px 0px 0px 13px;
}

img{
border :none;
}

ul.rss{
margin :0px;
padding :0px;
width :100%;
text-align :center;
}

ul.rss li {
border-right :#999 1px solid;
display :inline;
font-size :12px;
font-style :normal;
font-weight :bold;
letter-spacing :0.2px;
margin-right :0.3em;
padding-right :0.5em;
padding-left :0.2em;
}

ul.rss a:link {
color :#333333;
text-decoration :none;
}

ul.rss a:visited {
color :#333333;
text-decoration :none;
}

ul.rss a:hover {
color :#999999;
text-decoration :none;
}

ul.rss a:active {
color :#333333;
text-decoration :none;
}

a {color:#272E3F;text-decoration:none;}
a:link {color:#272E3F;text-decoration:none;}
a:visited {color:#272E3F;text-decoration:none;}
a:active {color:#272E3F;text-decoration:none;}
a:hover {color:#222222;text-decoration:none;}

a.acalendar {color:#DB6D00;text-decoration:none;}
a.acalendar:link {color:#DB6D00;text-decoration:none;}
a.acalendar:visited {color:#DB6D00;text-decoration:none;}
a.acalendar:active {color:#DB6D00;text-decoration:none;}
a.acalendar:hover {color:#5A5F3A;text-decoration:none;}

a.acontinues {color:#5A5F3A;text-decoration:none;}
a.acontinues:link {color:#5A5F3A;text-decoration:none;}
a.acontinues:visited {color:#5A5F3A;text-decoration:none;}
a.acontinues:active {color:#5A5F3A;text-decoration:none;}
a.acontinues:hover {color:#DB6D00;text-decoration:none;}

a.amenu {color:#5A5F3A;text-decoration:none;}
a.amenu:link {color:#5A5F3A;text-decoration:none;}
a.amenu:visited {color:#5A5F3A;text-decoration:none;}
a.amenu:active {color:#5A5F3A0;text-decoration:none;}
a.amenu:hover {color:#DB6D00;text-decoration:none;}

.header_scroll{/*ヘッダ広告*/
background: #ffffff url(/img/bg_head.gif) repeat-x;
background-position:bottom;
text-decoration:none;
color:#333333;
font-size:12px;
margin:0px;
letter-spacing:2px;
padding:0px 0px 3px 5px;
}

.header_scroll a:link {
font-size: 12px;
color: #333333;
letter-spacing:2px;
text-decoration:none;
}

.header_scroll a:visited {
font-size: 12px;
color: #333333;
letter-spacing:2px;
text-decoration:none;
}

.header_scroll a:hover {
font-size: 12px;
color: #333333;
letter-spacing:2px;
}

.header_scroll a:active {
font-size: 12px;
color: #333333;
letter-spacing:2px;
text-decoration:none;
}

#container{ font-size:12px;
width :740px;
background-color :#FFFFFF;
margin :0px auto;
text-align:left;
}

#banner,#subbanner{
background :#272E3F url(http://) right bottom;/*タイトル画像をURLで指定(740px×210px以上のサイズ)*/
padding :0px 10px 10px 10px; :0px 10px 10px 10px; }

#banner a {color:#575E5E;text-decoration:none;}/*タイトル画像の色によっては変更が必要*/
#banner a:link {color:#575E5E;text-decoration:none;}/*タイトル画像の色によっては変更が必要*/
#banner a:visited {color:#575E5E;text-decoration:none;}/*タイトル画像の色によっては変更が必要*/
#banner a:active {color:#575E5E;text-decoration:none;}/*タイトル画像の色によっては変更が必要*/
#banner a:hover {color:#D0D2D2;text-decoration:none;}/*タイトル画像の色によっては変更が必要*/

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

.blogtitle{
font-size :18px;
font-weight :bold;
padding :10px 0px 0px 10px;
text-align :left;
letter-spacing :1px;
}

.description{
color :#575E5E;/*ブログ説明文文字色・タイトル画像の色によっては変更が必要*/
font-size :10px;
padding :4px 0px 150px 35px;
text-align :left;
letter-spacing :1px;
}


#content{
width:545px;
float:right;
background-color :#ffffff;
}

#links{
width:185px;
float:left;
text-align :left;
margin :0px 0px 0px 0px;
padding :20px 0px 0px 10px;
background-color :#ffffff;
overflow:hidden;
}


#footer{
clear :both;
}

#copyright{/*最下段Copyrightの部分*/
background :#272E3F bottom;/*背景色*/
width :100%;
height :16px;
font-size :10px;
font-weight :bold;
color :#fff;/*文字色*/
margin :0px;
padding :0px;
line-height :16px;
text-align :center;
}

.blog{
margin :20px 10px 20px 15px;
}

.date{
border-top :3px solid #272E3F;
background :#FFFFFF;
background-position :1px 1px;
color :#272E3F;
font-size :12px;
letter-spacing :2px;
padding :5px 0px 5px 5px;
}

.blogbody{
background :#fff;
margin :0px 0px 10px 0px;
padding :8px;
}

.title{
background :#A9AFAF;
color :#FFFFFF;
font-size :12px;
font-weight :bold;
height :10px;
padding :3px 3px 3px 3px;
}

.main{
width :502px;
color :#222222;
font-size :11px;
padding :15px 0px 15px 0px;
overflow:auto;
line-height:135%;
}

.main a:link {color:#272E3F;text-decoration:underline;}
.main a:visited {color:#272E3F;text-decoration:underline;}
.main a:active {color:#272E3F;text-decoration:underline;}
.main a:hover {color:#D7683E;text-decoration:none;}

.main img{
margin:5px;
padding:5px;
border-top:1px solid #cccccc;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #cccccc;
background-color:#F6F6F6;
}


.main-continues{
font-size :11px;
}

.posted{
color :#222;
font-size :10px;
text-align :right;
margin :0px 0px 25px 0px;
}

a.aposted {color:#272E3F;text-decoration:none;font-weight:bold;font-size:10px;}
a.aposted:link {color:#272E3F;text-decoration:none;font-weight:bold;}
a.aposted:visited {color:#272E3F;text-decoration:none;font-weight:bold;}
a.aposted:active {color:#272E3F;text-decoration:none;font-weight:bold;}
a.aposted:hover {color:#D7683E;text-decoration:none;font-weight:bold;}

.menu{
color :#222;
font-size :11px;
text-align :right;
}

.comments-head{
color :#222;
font-size :11px;
font-weight :bold;
padding :0px 0px 0px 0px;
height:10px;
}

.comments-body{
font-size :11px;
line-height :135%;
margin :20px 0px 15px 13px;
}

.comments-post{
color :#222;
font-size :11px;
text-align :right;
margin :0px 0px 25px 0px;
}

.trackback-url{
color :#691815;
font-size :11px;
font-weight :bold;
margin :20px 0px 15px 13px;
}

.trackback-body{
font-size :10px;
line-height :135%;
margin :20px 0px 15px 13px;
}

.trackback-post{
color :#222;
font-size :10px;
text-align :right;
margin :0px 0px 25px 0px;
font-weight :bold;
}

a.atrackback-post {color:#272E3F;text-decoration:none;font-weight:bold;}
a.atrackback-post:link {color:#272E3F;text-decoration:none;font-weight:bold;}
a.atrackback-post:visited {color:#272E3F;text-decoration:none;font-weight:bold;}
a.atrackback-post:active {color:#272E3F;text-decoration:none;font-weight:bold;}
a.atrackback-post:hover {color:#D7683E;text-decoration:none;font-weight:bold;}

label{
font-size :10px;
font-weight :bold;
}

#author{
width :200px;
border :1px solid #222;
}
#email{
width :200px;
border :1px solid #222;
}
#url{
width :200px;
border :1px solid #222;
}
#text{ font-size:12px;
width :400px;
height :200px;
border :1px solid #222;
}
.pagetop{
font-size :11px;
text-align :right;
margin :0px 0px 25px 0px;
}
.calendarhead{
border-top : 1px none #666;
border-left : 1px none #666;
border-right : 1px none #666;
color:#333;
font-size:12px;
font-weight:bold;
letter-spacing:2px;
padding:0px 0px 2px 0px;
text-align:left;
padding:3px 0px 3px 15px;

}
.calendartable{
margin:0px auto 10px auto;
width:183px;
text-align:left;
background:#fff;
border-top:1px solid #5C5243;
border-left:1px solid #5C5243;
border-right:1px solid #5C5243;
border-bottom : 1px solid #5C5243;
border-spacing:0px;
}

.calendartable a:link {color:#DB6D00;text-decoration:none;}
.calendartable a:visited {color:#DB6D00;text-decoration:none;}
.calendartable a:active {color:#DB6D00;text-decoration:none;}
.calendartable a:hover {color:#5A5F3A;text-decoration:none;}

.calendarweek{
color:#222;
font-size:10px;
font-weight: bold;
}


.calendarwd{
/* border-left : 1px solid #222;
border-right : 1px solid #222;*/
background:#FFFFFF;
background-position:-2px 0px;
color :#fff;
font-size:10px;
font-weight:bold;
letter-spacing : 2px;
padding:2px 0px 2px 5px;
}
.calendard{
empty-cells:show;
border-top:1px solid #efefef;
border-right:1px solid #efefef;
text-align: center;
}
.calender{
font-size:10px;
padding:2px 2px;

}


.sidetitle{
border-top :3px solid #272E3F;
background :#FFFFFF top left;
background-position :1px 1px;
color :#272E3F;
font-size :11px;
letter-spacing :2px;
padding :5px 0px 5px 5px;
width:178px;
}

.side{
font-size :11px;
line-height :140%;
margin :0px 0px 10px 0px;
padding :8px;
border-left :1px solid #FFFFFF;
border-right :1px solid #FFFFFF;
border-bottom :1px solid #FFFFFF;
width:167px;
}

a.aside {color:#272E3F;text-decoration:none;}
a.aside:link {color:#272E3F;text-decoration:none;}
a.aside:visited {color:#272E3F;text-decoration:none;}
a.aside:active {color:#272E3F;text-decoration:none;}
a.aside:hover {color:#D7683E;text-decoration:none;}

a.arss {color:#5A5F3A;text-decoration:none;}
a.arss:link {color:#5A5F3A;text-decoration:none;}
a.arss:visited {color:#5A5F3A;text-decoration:none;}
a.arss:active {color:#5A5F3A;text-decoration:none;}
a.arss:hover {color:#DB6D00;text-decoration:none;}

.photo{
text-align :center;
}

.nickname{
color :#272E3F;

font-weight :bold;
margin :10px 0px;
}

.message{

}

.quotetable{
}

.quote{
color :#000;
font-size :12px;
padding :1px;
}

.blogtimes{

margin :0px 0px 16px 0px;
text-align :center;
}

.powered{
text-align :center;
margin :0px 0px 10px 0px;
}

.syndicate{
font-size :12px;
text-align :center;
}
.checkers{
font-size :12px;
margin-top:10px;
}

a.adtitle {font-weight:bold;text-decoration:none;}
a.adtitle:link {font-weight:bold;text-decoration:none;}
a.adtitle:visited {font-weight:bold;text-decoration:none;}
a.adtitle:active {font-weight:bold;text-decoration:none;}
a.adtitle:hover {font-weight:bold;text-decoration:none;}

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

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

a.adld {text-decoration:none;}
a.adld:link {text-decoration:none;}
a.adld:visited {text-decoration:none;}
a.adld:active {text-decoration:none;}
a.adld:hover {text-decoration:none;}

body.ad{
background :#f7p39f;
}

blockquote {
border-left :3px solid #A9AFAF;
background :#D0D2D2;
padding: 7px;
color:#222;
}