昨日は、背景画像を貼りこむことに成功しましたね!
↑こんな状態だったのを、↓こんなふうにまでしましたよね~
今日は、「文字の色」や「タイトルの位置」なんかを変えることで、
↓こんなふうにもっていきましょう^^
まず、ブログのタイトルも文字色、中央の記事の見出し部分の色、左右のメニューの見出し部分の色を変えます~
/*============ ☆ かんたんスキンカスタマイズはこちら ☆ ==============*/
/*:(コロン)と、;(セミコロン)の間に色、画像、サイズなどを指定して下さい*/
/*1)ブログタイトルの文字サイズを変更する*/
#header h1{
font-size: 3.0em; /*-- 25px相当の文字サイズ --*/
}
/*2)ブログタイトルの文字色を変更する*/
#header h1 a{
color:#dddddd;
}
/*3)ブログ説明の文字サイズを変更する*/
#header h2{
font-size: 1.0em; /*-- 12px相当の文字サイズ --*/
}
/*4)ブログ説明の文字色を変更する*/
#header h2{
color:#cccccc;
}
/*5)ページ背景に画像を入れる*/
body{
background-image:url( 画像のURL );
}
/*6)ページ全体の文字色を変更する*/
body{
color: #666666;
}
/*7)記事タイトルの背景色を変更する*/
.entry h3.title{
background-color: #cccccc;
}
/*8)記事タイトルの文字色を変更する*/
.entry h3.title{
color: #D04A62;
}
/*9)サイドバーの見出し文字色を変更する*/
h4.menu_title{
color: #cccccc;
}
/*10)サイドバーの見出し背景色を変更する*/
h4.menu_title{
background-color: #D04A62;
このように、コロン:とセミコロン;の間に希望するカラーコードを指定します。
次に、リンクの文字色や訪問済みの文字色なども変えてしまいます。
一般的にリンク文字は青、訪問済みは紫、などというお約束もあるのですが、
ブログのデザインには絶対必要でもないので、同じ色にしてしまいました。
そのかわり、マウスを当てたときは色が変わるようにしてあります。
/*■■■デザインカスタマイズ - スキン基本設定*/
/*■リンク*/
a{
text-decoration:none;
color:#666666;
}
/*■リンク:訪問済み*/
a:visited{
text-decoration:none;
color:#666666;
}
/*■リンク:マウスオーバー時*/
a:hover{
text-decoration:underline;
color:#FF3366; ←この色はデフォルトのままにしました
}
/*■コンテンツ全体*/
#frame{
background-color:;
}
/*■メインカラム*/
#main{
}
/*■サイドカラムA*/
#sub_a{
color:#666666;
background-color:;
}
/*■サイドカラムB*/
#sub_b{
color:#666666;
background-color:;
}
最後に、ブログタイトルの位置を少しずらしてみます。
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*■■■■■■■■■■■ ヘッダー ■■■■■■■■■■■■*/
/*■■■基本設定 - ヘッダー*/
#header{
margin:0;
padding:50px 0px 0px 50px;
この部分の数字を変えると、タイトルの上、右、下、左の余白が変わります。→タイトルの位置が動くことになります。
}
#header h1{
margin:0;
padding:0px 0px 0px 0px;
}
#header h2{
margin:0;
padding:10px 0px 0px 10px;
}
今日はおしまぃー
p.s. そうそう~~ 背景画像をページをスクロールしても動かないようにする方法がありまする^^
background-attachment:fixed;
この呪文を、
/*5)ページ背景に画像を入れる*/
body{
background-image:url(画像URL);
background-attachment:fixed;
}
という具合に追加するだけでおkです^^
このβ易タンのブログもそうやって背景画像を「固定」してあるのでふ^^
これを使うと、もっと面白いこともできちゃうという話はまた今度~~|'-')ノシノシ
私もわっけわかめだったよーーーーww
今はわっけくらいかなw
何を書いてるのか自体わかりません;;
なんとか?理解?出来たっぽいw
起きたら試してみるw
すかぽんたん
よい子のための講座だよん