【livedoor ブログ】-CSS（スタイルシート）カスタマイズ - 無料ブログ
livedoor ブログのCSS（スタイルシート）カスタマイズ紹介！現在、使用中のlivedoor ブログのスタイルシートの変更箇所など掲載して具体的に解説！初心者向けの内容です。
CSS（スタイルシート）カスタマイズ
●色分けの説明
・青色のタグは変更・挿入したタグ
・ピンク色は、コメントタグ。これは、ちょっとしたメモするときに使うタグで、画面には表示されない。
・赤色のタグは、livedoor独自のタグ。このタグはそれぞれに決まったデータが挿入されるようになってる。変数みたいなもの。下記に変数と値の対照表を作成してるので参考にして下さい。
トップページ、テンプレート
@charset "EUC-JP";
body{
color:#000000;
background:#ffffff;
margin:0px 0px 0px 0px;
}
a{color:#0000ff;text-decoration:underline;}
a:link{color:#0000ff;text-decoration:underline;}
a:visited{color: #800080;text-decoration:underline;}
a:active{color: #dc143c; text-decoration: underline}
a:hover{color:#000000;text-decoration:none;background-color: #ffd700;}
a.mark{ font-weight: bolder;font-size: 110%;}
a.acontinues{color:#339999;text-decoration:underline;}
a.acontinues:link{color:#339999;text-decoration:underline;}
a.acontinues:visited{text-decoration:underline;}
a.acontinues:active{}
a.acontinues:hover{color:#999999;text-decoration:none;}
a.amenu{color:#333333;text-decoration:underline;}
a.amenu:link{color:#333333;text-decoration:underline;}
a.amenu:visited{text-decoration:underline;}
a.amenu:active{}
a.amenu:hover{color:#999999;text-decoration:none;}
div.main{
margin:20px 0px 15px 15px;
}
.main-continues{
margin:0px 0px 0px 0px;
}
h1,h2,h3{
margin:0px;
padding:0px;
}
label {
font-size:x-small;
font-weight:bold;
}
#banner,#subbanner{
background:#d7d7d7;
border-bottom:1px solid #999999;
}
#banner a{color:#000000;text-decoration:none;}
#banner a:link{color:#000000;text-decoration:none;}
#banner a:visited{text-decoration:none;}
#banner a:active{}
#banner a:hover{color:#999999;text-decoration:none;}
#subbanner a{color:#000000;text-decoration:none;}
#subbanner a:link{color:#000000;text-decoration:none;}
#subbanner a:visited{text-decoration:none;}
#subbanner a:active{}
#subbanner a:hover{color:#999999;text-decoration:none;}
.description{
font-family:;
font-size:small;
font-weight:bold;
text-transform:none;
padding:0px 0px 5px 20px;
border-bottom:1px solid #ffffff;
}
#content{
width:70%;
float:right;
}
#links{
float:left;
width:27%;
padding:25px 0px 50px 20px;
text-align:center;
background-color: #fdefd2;
}
.blog{
padding:20px 20px 25px 15px;
}
.menu{
color:#666;
font-size:xx-small;
text-align:right;
}
.blogbody{
font-family:;
font-size:90%;
line-height:135%;
margin:10px 15px 0px 15px;
}
.blogbody a,
.blogbody a:link,
.blogbody a:visited,
.blogbody a:active{
font-weight:normal;
text-decoration:underline;
}
.blogbody a:hover{color:#999999;text-decoration:none;}
.blogtitle{
font-family:;
color:#000000;
font-size:24px;
font-weight:bold;
text-decoration:none;
padding:40px 0px 5px 20px;
}
.title{
font-family:;
font-size:x-small;
font-weight:bold;
padding:0px 0px 2px 5px;
border-bottom:1px solid #999999;
}
.date{
font-family:;
font-size:x-small;
font-weight:bold;
color:#333;
padding:5px 0px 3px 10px;
border-bottom:1px solid #999;
border-right:1px solid #999;
background:#e5e5e5;
}
.posted{
color:#666;
font-family:;
font-size:xx-small;
text-align:right;
margin:0px 0px 25px 0px;
}
a.aposted{color:#333333;text-decoration:underline;font-weight:bold;}
a.aposted:link{color:#333333;text-decoration:underline;font-weight:bold;}
a.aposted:visited{text-decoration:underline;font-weight:bold;}
a.aposted:active{font-weight:bold;}
a.aposted:hover{color:#999999;text-decoration:none;font-weight:bold;}
.calendar{
font-family:;
font-size:xx-small;
position:center;
}
.calendarhead{
font-family:;
font-size:xx-small;
font-weight:bold;
letter-spacing:5px;
margin:0px 0px 10px 0px;
}
.calendard{border-top:1px solid #cccccc;empty-cells:show;}
.calendardbg{border-top:1px solid #cccccc;empty-cells:show;}
.calendartable{text-align:center;border:1px solid #cccccc;margin:0 auto 10px auto;}
.calendarwd{background:#e5e5e5;padding:2px;}
.calendarweek{font-size:xx-small;position:center;}
.side{
font-family:;
font-size:12px;
line-height:135%;
text-align:left;
border-bottom:1px solid #cccccc;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
padding:5px;
margin:0px 0px 10px 0px;
}
.sidetitle{
font-family:;
font-size:xx-small;
font-weight:bold;
background:#e5e5e5;
text-align:center;
padding:5px;
border-top:1px solid #cccccc;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
letter-spacing:5px;
}
.comments-body{
font-family:;
font-size:x-small;
margin:20px 0px 15px 15px;
}
.comments-head{
font-family:;
font-size:x-small;
font-weight:bold;
padding:0px 0px 2px 5px;
border-bottom:1px solid #999999;
}
.comments-post {
color:#666;
font-family:;
font-size:xx-small;
text-align:right;
margin:0px 0px 25px 0px;
}
.trackback-body{
font-family:;
font-size:x-small;
margin:20px 0px 15px 15px;
}
.trackback-post{
font-family:;
color:#666;
font-size:xx-small;
text-align:right;
margin:0px 0px 25px 0px;
}
a.atrackback-post{color:#333333;text-decoration:underline;font-weight:bold;}
a.atrackback-post:link{color:#333333;text-decoration:underline;font-weight:bold;}
a.atrackback-post:visited{text-decoration:underline;font-weight:bold;}
a.atrackback-post:active{font-weight:bold;}
a.atrackback-post:hover{color:#999999;text-decoration:none;font-weight:bold;}
.trackback-url{
color:#339999;
font-family:;
font-size:x-small;
font-weight:bold;
margin:20px 0px 25px 40px;
}
table.form{margin:25px 0 0 0;}
#author{width:200px;border:1px solid #339999;}
#email{width:200px;border:1px solid #339999;}
#url{width:200px;border:1px solid #339999;}
#text{width:500px;height:200px;border:1px solid #339999;}
.photo{text-align:center;}
.nickname{color:#000000;font-size:xx-small;font-weight:bold;margin:10px 0;}
.message{font-size:xx-small;}
.quotetable{background:#cccccc;}
.quote{color:#000000;font-size:xx-small;padding:1px;background:#ffffff;}
.blogtimes{margin:0 0 10px 0;text-align:center;}
.powered{
text-align:center;
margin:0px 0px 10px 0px;
}
.syndicate{
font-family:;
font-size:xx-small;
text-align:center;
}
.pagetop{
font-family:;
color:#666;
font-size:xx-small;
margin:0px 0px 25px 0px;
text-align:right;
}
blockquote{
margin:0px 0px 0px 40px;
color:#339999;
}
pre{
font-family:;
font-size: x-small;
line-height:1.2em;
border:1px solid #aaa;
background:#eee;
padding:0.5em;
}
.checkers{
font-size:xx-small;
margin-top:10px;
}
a.adtitle{font-weight:bold;text-decoration:underline;}
a.adtitle:link{font-weight:bold;text-decoration:underline;}
a.adtitle:visited{font-weight:bold;text-decoration:underline;}
a.adtitle:active{font-weight:bold;text-decoration:underline;}
a.adtitle:hover{font-weight:bold;text-decoration:underline;}
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:blue;text-decoration:none;}
a.adurl:link{color:blue;text-decoration:none;}
a.adurl:visited{color:blue;text-decoration:none;}
a.adurl:active{color:blue;text-decoration:none;}
a.adurl:hover{color:blue;text-decoration:none;}
a.adld{text-decoration:underline;}
a.adld:link{text-decoration:underline;}
a.adld:visited{text-decoration:underline;}
a.adld:active{text-decoration:underline;}
a.adld:hover{text-decoration:underline;}
body.ad{background:url('http://image.blog.livedoor.com/img/spacer.gif');}
body{
color:#000000;
background:#ffffff;
margin:0px 0px 0px 0px;
}
a{color:#0000ff;text-decoration:underline;}
a:link{color:#0000ff;text-decoration:underline;}
a:visited{color: #800080;text-decoration:underline;}
a:active{color: #dc143c; text-decoration: underline}
a:hover{color:#000000;text-decoration:none;background-color: #ffd700;}
a.mark{ font-weight: bolder;font-size: 110%;}
a.acontinues{color:#339999;text-decoration:underline;}
a.acontinues:link{color:#339999;text-decoration:underline;}
a.acontinues:visited{text-decoration:underline;}
a.acontinues:active{}
a.acontinues:hover{color:#999999;text-decoration:none;}
a.amenu{color:#333333;text-decoration:underline;}
a.amenu:link{color:#333333;text-decoration:underline;}
a.amenu:visited{text-decoration:underline;}
a.amenu:active{}
a.amenu:hover{color:#999999;text-decoration:none;}
div.main{
margin:20px 0px 15px 15px;
}
.main-continues{
margin:0px 0px 0px 0px;
}
h1,h2,h3{
margin:0px;
padding:0px;
}
label {
font-size:x-small;
font-weight:bold;
}
#banner,#subbanner{
background:#d7d7d7;
border-bottom:1px solid #999999;
}
#banner a{color:#000000;text-decoration:none;}
#banner a:link{color:#000000;text-decoration:none;}
#banner a:visited{text-decoration:none;}
#banner a:active{}
#banner a:hover{color:#999999;text-decoration:none;}
#subbanner a{color:#000000;text-decoration:none;}
#subbanner a:link{color:#000000;text-decoration:none;}
#subbanner a:visited{text-decoration:none;}
#subbanner a:active{}
#subbanner a:hover{color:#999999;text-decoration:none;}
.description{
font-family:;
font-size:small;
font-weight:bold;
text-transform:none;
padding:0px 0px 5px 20px;
border-bottom:1px solid #ffffff;
}
#content{
width:70%;
float:right;
}
#links{
float:left;
width:27%;
padding:25px 0px 50px 20px;
text-align:center;
background-color: #fdefd2;
}
.blog{
padding:20px 20px 25px 15px;
}
.menu{
color:#666;
font-size:xx-small;
text-align:right;
}
.blogbody{
font-family:;
font-size:90%;
line-height:135%;
margin:10px 15px 0px 15px;
}
.blogbody a,
.blogbody a:link,
.blogbody a:visited,
.blogbody a:active{
font-weight:normal;
text-decoration:underline;
}
.blogbody a:hover{color:#999999;text-decoration:none;}
.blogtitle{
font-family:;
color:#000000;
font-size:24px;
font-weight:bold;
text-decoration:none;
padding:40px 0px 5px 20px;
}
.title{
font-family:;
font-size:x-small;
font-weight:bold;
padding:0px 0px 2px 5px;
border-bottom:1px solid #999999;
}
.date{
font-family:;
font-size:x-small;
font-weight:bold;
color:#333;
padding:5px 0px 3px 10px;
border-bottom:1px solid #999;
border-right:1px solid #999;
background:#e5e5e5;
}
.posted{
color:#666;
font-family:;
font-size:xx-small;
text-align:right;
margin:0px 0px 25px 0px;
}
a.aposted{color:#333333;text-decoration:underline;font-weight:bold;}
a.aposted:link{color:#333333;text-decoration:underline;font-weight:bold;}
a.aposted:visited{text-decoration:underline;font-weight:bold;}
a.aposted:active{font-weight:bold;}
a.aposted:hover{color:#999999;text-decoration:none;font-weight:bold;}
.calendar{
font-family:;
font-size:xx-small;
position:center;
}
.calendarhead{
font-family:;
font-size:xx-small;
font-weight:bold;
letter-spacing:5px;
margin:0px 0px 10px 0px;
}
.calendard{border-top:1px solid #cccccc;empty-cells:show;}
.calendardbg{border-top:1px solid #cccccc;empty-cells:show;}
.calendartable{text-align:center;border:1px solid #cccccc;margin:0 auto 10px auto;}
.calendarwd{background:#e5e5e5;padding:2px;}
.calendarweek{font-size:xx-small;position:center;}
.side{
font-family:;
font-size:12px;
line-height:135%;
text-align:left;
border-bottom:1px solid #cccccc;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
padding:5px;
margin:0px 0px 10px 0px;
}
.sidetitle{
font-family:;
font-size:xx-small;
font-weight:bold;
background:#e5e5e5;
text-align:center;
padding:5px;
border-top:1px solid #cccccc;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
letter-spacing:5px;
}
.comments-body{
font-family:;
font-size:x-small;
margin:20px 0px 15px 15px;
}
.comments-head{
font-family:;
font-size:x-small;
font-weight:bold;
padding:0px 0px 2px 5px;
border-bottom:1px solid #999999;
}
.comments-post {
color:#666;
font-family:;
font-size:xx-small;
text-align:right;
margin:0px 0px 25px 0px;
}
.trackback-body{
font-family:;
font-size:x-small;
margin:20px 0px 15px 15px;
}
.trackback-post{
font-family:;
color:#666;
font-size:xx-small;
text-align:right;
margin:0px 0px 25px 0px;
}
a.atrackback-post{color:#333333;text-decoration:underline;font-weight:bold;}
a.atrackback-post:link{color:#333333;text-decoration:underline;font-weight:bold;}
a.atrackback-post:visited{text-decoration:underline;font-weight:bold;}
a.atrackback-post:active{font-weight:bold;}
a.atrackback-post:hover{color:#999999;text-decoration:none;font-weight:bold;}
.trackback-url{
color:#339999;
font-family:;
font-size:x-small;
font-weight:bold;
margin:20px 0px 25px 40px;
}
table.form{margin:25px 0 0 0;}
#author{width:200px;border:1px solid #339999;}
#email{width:200px;border:1px solid #339999;}
#url{width:200px;border:1px solid #339999;}
#text{width:500px;height:200px;border:1px solid #339999;}
.photo{text-align:center;}
.nickname{color:#000000;font-size:xx-small;font-weight:bold;margin:10px 0;}
.message{font-size:xx-small;}
.quotetable{background:#cccccc;}
.quote{color:#000000;font-size:xx-small;padding:1px;background:#ffffff;}
.blogtimes{margin:0 0 10px 0;text-align:center;}
.powered{
text-align:center;
margin:0px 0px 10px 0px;
}
.syndicate{
font-family:;
font-size:xx-small;
text-align:center;
}
.pagetop{
font-family:;
color:#666;
font-size:xx-small;
margin:0px 0px 25px 0px;
text-align:right;
}
blockquote{
margin:0px 0px 0px 40px;
color:#339999;
}
pre{
font-family:;
font-size: x-small;
line-height:1.2em;
border:1px solid #aaa;
background:#eee;
padding:0.5em;
}
.checkers{
font-size:xx-small;
margin-top:10px;
}
a.adtitle{font-weight:bold;text-decoration:underline;}
a.adtitle:link{font-weight:bold;text-decoration:underline;}
a.adtitle:visited{font-weight:bold;text-decoration:underline;}
a.adtitle:active{font-weight:bold;text-decoration:underline;}
a.adtitle:hover{font-weight:bold;text-decoration:underline;}
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:blue;text-decoration:none;}
a.adurl:link{color:blue;text-decoration:none;}
a.adurl:visited{color:blue;text-decoration:none;}
a.adurl:active{color:blue;text-decoration:none;}
a.adurl:hover{color:blue;text-decoration:none;}
a.adld{text-decoration:underline;}
a.adld:link{text-decoration:underline;}
a.adld:visited{text-decoration:underline;}
a.adld:active{text-decoration:underline;}
a.adld:hover{text-decoration:underline;}
body.ad{background:url('http://image.blog.livedoor.com/img/spacer.gif');}
