リンクルデザイン変えてみよう

以上で、body要素の背景に画像を指定する作業は、
完了です。
ちなみに、このブログの記述は

/* ベースデザイン */
body {
 color: #800000;
 background-image:url(http://linkul.net/antenna/image/1222145671850.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position:left bottom;
 font-style: normal;
 font-weight: normal;
 font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", sans-serif;
 line-height: 130%;
 font-variant: normal;
    margin-top:0px;
}

になります。

background-image:url(http://linkul.net/antenna/image/1222145671850.jpg);
↑ここは、1行で入力してくださいね。

今回は長すぎるため2行に改行されているように見えますが、1行でお願い
します。
++++++++++++++++++++++ここから画像のアドレスの調べ方と指定です++++++++

(　　　　）の中にはいるアドレスは、コピーしてしまいましょう＾＾

1.画像ライブラリをクリックする



2.背景画像にしたい写真の　見るをクリックする


3.別ウィンドウで、写真が開いてきますので、アドレスのところコピーします。



4.アドレスの上にマウスポインタを置いて右クリックして、コピーします。

そして、("　　　　　")の中に貼り付けてください。

ＦｉｒｅＦｏｘは、別タブで開いてきますから、同じようにしてください。＾＾

++++++++++++++++++++++ここまでは、画像のアドレスの調べかたと指定です+++++

 そこで、(〟-_・)ン?ちょっと、しっくりきませんよね。
なにが？それは、本文の背景の白色が邪魔をして、なんか、
中途半端な感じです。そこで、この背景の白色たちを
消してしまいましょう！

CSSから以下の記述を探しましょう

.box {
 background-color: #000000;
 width: 760px;
 padding: 1px;
}

ここの、 background-color: #000000;を思い切って
消してしまいましょう！
そうすると、枠線が無くなってしまうので、代わりに、私は
        border-left:1px solid #000000;
     border-right:1px solid #000000;

を追加しましたが、別になくてもかまいません。

私のブログは、こうなってます。↓↓↓
.box {
 width: 760px;
 padding: 1px;
 border-left:1px solid #000000;
 border-right:1px solid #000000;
}

ε- (￣、￣A) フゥー　　これで安心しないでくださいね。
まだまだ、白い背景は消えておりません。

ＣＳＳの記述の中から

/* エントリー関連 */

.main {
 background-color: white;
 padding: 10px;
}

↑を探してください。そして
 background-color: white;
の部分を消してしまってください。

そうすると、背景を色で指定したところがなくなりますので
bodyに入れた背景要素がきれいに表示されます。

今回の改造で、ガラっとブログイメージが変わったはずです。

今回利用させていただいた背景画像は、

自然いっぱいの素材集さんです。

素材の小路さんなんかも、固定背景に
使えるキレイな背景がありあるようです。

このほかにも色々背景画像に利用できる素材サイトが
ありますから、調べてみてください。

ホームページ用の素材を配布しているサイトは
どういうわけか、目的の場所に（素材のあるところ）
に行くまでがものすごくわかりにくいところが
多いので、気長にさがしてくださいね。

とりあえず、これで１日目の授業を終わります。

２日目の授業も考えていかないと・・・・