kuu♪からのお知らせ

長年公開してきたカスタムスキンへの道ですが、
新しいサイト　Harbot's field内の「ssブログ（so-netブログ）のカスタマイズ方法」　へ引っ越しをします。

徐々に時間をかけて引っ越す予定で、今よりも見やすいサイトに変更しています。

今後ともよろしくお願いいたします。

記事タイトルの文字色を変えよう

【記事タイトルの文字色を変えよう】

■変える部分を赤で書いています。

---

/* Articles */　

.articles-title { margin:0 0 15px 0; padding:3px 10px; background:#003366; font-size:small; color:#ffffff; }

color:#ffffffの#ffffffを変えましょう。

＊色の載せ方は、 、【基本の背景色を変えよう】に記述してあります。

＊使うスキンによってはこの記述がないものもあります。
　その場合は、color:#ffffff　を付け加えれば記事タイトル色の指定ができるようになります。

 

ソネットブログ（so-netblog）：カスタムスキンへの道【目次】へ

タグ：ソネブロ ソネットブログ So-netBlog カスタムスキン カスタマイズ 記事タイトルの文字色を変える

全体的な文字色を変えよう

【全体的な文字色を変えよう】

★ここで変えるのは全体的な文字色変更です。

文字色の指定は、個別にも設定できます。
個別設定をしない限りここで設定した色が反映されます。

＊ただし、使うカスタムスキンによっては最初から個別設定してあるものもあるので注意してください。

個別設定は、それぞれの設定の仕方をみてください。

変える部分を赤で書いています。

---

/*-----Common-----*/　とあります。（いちばん上です。）　
その中の

#container { width :770px; margin:0 auto; line-height:1.4; text-align:left; color:#333333; }

 

をあつかいます。
color:#333333;の#333333を変えましょう。

色の載せ方は、 、【基本の背景色を変えよう】に記述してあります。

 

ソネットブログ(so-netblog)：カスタムスキンへの道【目次】へ

 

タグ：ソネブロ ソネットブログ So-netBlog カスタムスキン カスタマイズ 全体的な文字色を変える

ブログタイトル＆サブタイトルの字の色を変えよう

【ブログタイトル＆サブタイトルの字の色を変えよう】

■変える部分を赤で書いています。

---

/*-----Header-----*/　とあります。（上の方です。）　その中の

#banner h1{ margin:0; padding:50px 0 25px 0; font-size:x-large; } #banner h1 a{ color:#ffffff; } #lead{ margin:0; color:#ffffff; }

・ブログタイトルの色は
#banner h1 a{
color:#ffffff;
}

・サブタイトルの色は
#lead{
margin:0;
color:#ffffff;
}

の中の#ffffff;　を変えます。

もしこの記述がなければ書き加えてください。

#banner h1 a{ color:#ffffff;　 } #lead{ color:#ffffff;　 margin:0; }

「#ffffff」の部分は自分で好きな色を載せてください。
色の載せ方は、 【基本の背景色を変えよう】に記述してあります。

ソネットブログ(so-netblog)：カスタムスキンへの道【目次】へ

タグ：ソネットブログ ソネブロ So-netBlog カスタムスキン カスタマイズ

文字サイズを変更する

-文字のサイズを変えるには、所定の場所に以下のタグを入れます。

font-size: small;

（小）xx-small　x-small　small　medium　large　x-large　xx-large（大）
xx-small が一番小さいサイズ、xx-large が一番大きいサイズになります。

もっと細かく設定したい場合は以下のタグを入れてください。
（数字は任意で変えてください）

font-size:16px;

---

挿入場所は

■全体的な設定は　#container {　の中に

■個別設定は、自分が変えたい場所に入れてください。以下を参考にしてください。
　　　□ブログタイトルなら　#banner h1{
　　　□ブログサブタイトルなら　#lead{
　　　□記事全体なら　.articles {
　　　□記事タイトルなら　.articles-title {
　　　□記事本文なら　.articles-body {
　　　□コメント欄なら　#comment-write textarea {
　　　□表示されるコメントなら　.comments-body {
　　　□サイドバー全体なら　.sidebar {
　　　□サイドバータイトルなら　.sidebar-title {
　　　□サイドバー本文なら　.sidebar-body {

タグ：ソネブロ ソネットブログ So-netBlog カスタムスキン カスタマイズ 文字サイズを変える

文字リンク色の変え方

文字のリンク色は下の4つから成り立ちます。
これを応用して、各部分の個別設定も可能です。

・a:link　は　ページ全体のリンク（まだ開いてない部分の色）
・a:visited　は　ページ全体のリンク（一度開いたことがある部分の色）
・a:active　は　ページ全体のリンク（その部分を選択しているときの色）
・a:hover　は　ページ全体のリンク（マウスを乗せているときの色）

 

---

■赤文字部分を変えることにより、色が変わります。

■青文字の
　　none　はリンク文字の下線なし
　　underline　はリンク文字の下線あり
　の指定です。

■色を選ぶには、『HTML　色一覧』もしくは『HTMLCOLOR』をＤＬするのが便利です。

全体のリンク色

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

記事タイトルのリンク色

.articles-title  a:link { text-decoration:none; color:#FFFFFF; } .articles-title  a:visited { text-decoration:none; color:#FFFFFF; } .articles-title  a:active { text-decoration:none; color:#FFFFFF; } .articles-title  a:hover { text-decoration:underline; color:#FFFFFF; }

記事本文のリンク色

.articles-body a:link { text-decoration:none; color:#FFFFFF; } .articles-body a:visited { text-decoration:none; color:#FFFFFF; } .articles-body a:active { text-decoration:none; color:#FFFFFF; } .articles-body a:hover { text-decoration:underline; color:#FFFFFF; }

サイドバータイトルのリンク色

.sidebar-title a:link { text-decoration:none; color:#FFFFFF; } .sidebar-title a:visited { text-decoration:none; color:#FFFFFF; } .sidebar-title a:active { text-decoration:none; color:#FFFFFF; } .sidebar-title a:hover { text-decoration:underline; color:#FFFFFF; }

サイドバー本文のリンク色

.sidebar-body a:link { text-decoration:none; color:#FFFFFF; } .sidebar-body a:visited { text-decoration:none; color:#FFFFFF; } .sidebar-body a:active { text-decoration:none; color:#FFFFFF; } .sidebar-body a:hover { text-decoration:underline; color:#FFFFFF; }

「読者になる」のリンク色

#rssRegist a:link { text-decoration:none; color:#FFFFFF; } #rssRegist a:visited { text-decoration:none; color:#FFFFFF; } #rssRegist a:active { text-decoration:none; color:#FFFFFF; } #rssRegist a:hover { text-decoration:underline; color:#FFFFFF; }

＊詳しくは各ページをご覧下さい。（この他の部分も設定できます。）

　　□文字のリンク色を変えよう
　　□記事タイトルの文字リンク色を変えよう
　　□記事本文の文字リンク色を変えよう
　　□サイドバータイトルの文字リンク色を変えよう
　　□サイドバー本文の文字リンク色を変えよう
　　□「読者になる」の文字リンク色を変えよう

 

タグ：ソネット ソネブロ ソネットブログ So-net blog カスタムスキン カスタマイズ 文字リンク色

ありがとうございます♪♪

記事が役に立たれたら、下のバナーの興味があるものをクリックしてもらうとうれしいです。