**ＣＳＳの編集でもっと素敵に♪**
やっと、出来上がりました・・・
それもまた、誰も見ないであろう時間に・・・(￣ー￣；
えっと・・・何度か、ＣＳＳの編集をしていて、壊れかけそうになってしまって（;´▽｀A``
とりあえず・・・ＣＳＳは変更する前に、コピーをして、保存していたので、良かったです(´∀｀)
※ＣＳＳの編集を行う前は、必ずメモ帳などに、コピーして下さいね
まず、私がオリジナルスキンにした時に、悪戦苦闘した、画像がリピートされて、表示される現象の
ＣＳＳの編集です
とーっても、懐かしい！！！
一番、はじめに作ったスキンです♪でも、画像はフリー画像ですけど・・・
この、↓赤丸のところを見てくださいねー(´∀｀)これは、一番右の部分の画像が繰り返しになってしまって
いる現象です・・・
これをＣＳＳの編集画面で、リピートさせないようにします
※ＣＳＳの編集画面へ進む工程は省きます
ＣＳＳ編集で、なんやら、英語や数字がいーーーっぱい出てきたと思いますが・・・
その、一番下の箇所に、
background-repeat:no-repeat;
この↑、青文字をコピーして、入力してみてください
すると・・・リピートされなくなりました(´0ﾉ｀*)
これは、私のＣＳＳで横幅の変更をしていないので、文字が飛び出した感じになっていますが、
気にしないで下さい（;´▽｀A``
もう、幅の変更までは、していません・・・
小さい、画像の場合は、リピートされたほうが、全体のバランスがいい時もありますので、お好みで
是非、やってみてくださいね♪
次は、今のオリジナルスキンに変更した時に、色々と調べて変更した事
ブログのタイトルと、説明文の位置の変更についてです
まず、変更していない、基本の位置にタイトルと説明文がある画像
なんだか、全部、左に寄ってキチキチしててますね・・・
これを好きな位置に変更していきます
ＣＳＳの編集画面に行き、ずーっと見ていっていたら、ヘッダーという部分があります
ここで、変更していきましょう
この、ｈ１がタイトル、ｈ２が説明文になります
↑の画面の数字は、基本設定になってますので、好きな位置に変更します
ちなみに・・・padding（パディング）が４つ指定されているので、右から時計回りに
上、右、下、左からの位置を指定しています。
padding:10px（上） 5px（右） 8px（下） 0px;（左）
私の場合、ｈ１（タイトル）を
#header h1{
margin:0;
padding:50px 5px 8px 20px;
}
この、２箇所のみ変更しました
ｈ２（説明文）も同様に
#header h2{
margin:0;
padding:10px 5px 45px 10px
1箇所を変更しました
変更後・・・
タイトルを下げて、左に少し余白を入れました
少し、見栄えが良くなったかな・・・？
まだ、タイトルの文字の大きさ変更や、説明文を折り返す方法など、さまざまな
ＣＳＳの編集があります
とりあえず、私が精一杯、説明して、お教えできるのは、これくらいかな・・・？
私も、また、いじって変更したい箇所がたくさんあるので、ぼちぼち合間を見て
やっていきたいです♪
よく、マメだねーって言われるけど、決してそんな事はないんです・・・
そもそも、ヘッダーを変えたいって思ったのは、「住まい・インテリア」のカテゴリに
登録されている方って、オリジナルのスキンを使っている人、多いし、自分のブログも、
画像が多いので、バックを白にしたり、オリジナリティを出したかったから・・・
最初は、アメブロのスキンでしていたけど、イマイチ好きなスキンがなかったし・・・
やっぱり、目に止まるような、ブログが作りたい！！！って・・・思って半年経っちゃいましたが。。。
意外と簡単なので、是非、作ってみてくださいね
前記事でも、書きましたが、すぐにチャレンジして、作ってくれている方がたくさんいて、
しかも、私より、めっちゃスゴイ。。。。。。。。。。。。。。。。。素敵
せっかくなので・・・お名前だけ出させて頂きます
リンクの許可をとっていませんので・・・えっと・・・見て見たい方は・・・コメントから飛んでください
ＨＮの前の番号は、コメントの順番になってます
**ヘッダー変更の理由と画像加工 vol.1** ← この記事のコメント
５：しほ茶ちゃん、７：marley*ちゃん、２２：
は～何しようかな・・・
寒くなってきたので、羊毛でもやろうかな・・・！(´Д｀；)