アメブロさ～ん・・・・ 画像が・・・

やばいです・・・画像が消えています
私は削除はしていません！
自分のパソコンの中にも元画像はありません

画像保存サーバのハードディスク不具合について
http://ameblo.jp/staff/entry-10198769097.html
原因はコレ・・・・？

>引き続き二日間程度は、ご自身のパソコンに保存いただくことをおすすめ致します。

な、こと言われたって3000枚近い画像をどうやって保存するのよ～

前にも記事にしたでしょ・・・
画像フォルダの使い勝手が悪いって・・・
古い画像がどうなっているかなんて何ページ進めば見られると思っているのですか
確認しようにもそのページに行き着くことすら出来ません

やり方を説明している画像ばかりなのでまじ困ります

追記・・・・

【障害報告】ユーザ画像のアップロード・閲覧不具合のご報告

http://ameblo.jp/staff/entry-10204678304.html

どうやらなおったようです

でも・・・　画像フォルダの使い勝手は何とかしてほしいです

古い画像はさわりたくても行き着くまでに一苦労です

何とかしてくださいお願いします・・・

CSS 背景2

みなさまはヘッド部分（タイトル部分）に背景画像は何枚くらい使えるかわかりますか？

基本的に背景画像は１つのセレクタに１つしか設定できません

ですのでブログの右と左に別の背景を設定することは不可能です

ただこんな画像ならなんとか・・・・

http://ameblo.jp/exlink001/

このブログは右はピンクのチェックで左はブルーのチェック柄の背景です

種明かしは・・・・

ブログの一番下を見ればわかるのですが

このような左右違う柄の１つの画像を縦に繰り返しで配置しています

body {
background-image:url(画像のＵＲＬ);
background-repeat:repeat-y ;/*縦に繰り返し*/
background-position:center top;
}

縦に配置しますので画像の横幅はじゅうぶんな長さにしないと

大きな解像度で見た場合は左右に画像の無い部分が出来てしまいます

次はページの上に大きな画像を配置してみます

http://ameblo.jp/exlink00/

やはり解像度の大きな画面で見られてもいいように横幅の大きな画像を使います

body{
color:#ffa500;
background-color:#351901; /*背景色*/
background-image:url(画像のＵＲＬ); /*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position:center top;/*左下に配置*/
}

#frame,
#sub_a,
#sub_b{
background-color:transparent;/*背景色を透明*/
}

div#footerArea{
background-color:transparent;/*背景色を透明*/
border:none;/*線を消す*/
}

つぎは立体感を出すためにヘッド部分に４枚の画像を重ねてみます
Flashを使えばいいじゃん～・・・って～のはなしで

http://ameblo.jp/exlink01/

間に合わせで画像を作っていますのでうまく透過できていませんし・・・動きも・・・・・

センスがないのが露見してしまいますが・・・・・

bodyに設定している画像

#subFrameに設定している画像



#overHeaderに設定している画像


#headerに設定している画像


このほかにもまだ＃userNaviAreaや#frameにも配置できます・・・

このように何枚も重ねる場合は透過処理をしないと下の画像が表示できません

body{
color:#FF9900;
background-color:#000000; /*背景色*/
background-image:url(背景画像--富士山);/*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position:center top;
}
#subFrame{
background-image:url(中の画像--東京タワー);/*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position:center top;
}
#overHeader{
height:300px;
background-image:url(手前の画像--ビル);/*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position:center top;
}
#frame,
#sub_a,
#sub_b{
background-color:transparent;/*背景色を透明*/
}
#header{
height:115px;
background-color:transparent;

background-image:url(背景画像--UFO);/*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position:center top;
}
#header h1,
#header h1 a{
color:#ffffff;
font-size:20px;
}
#header h2{
color:#ffffff;
}
div#footerArea{
background-color:transparent;/*背景色を透明*/
border:none;/*線を消す*/
}

今回はヘッド部分を紹介していますが・・・

このように背景画像を置ける場所は何ヶ所もあります

探してみてください

CSS　背景

CSS　背景3

CSS 背景・・・

また背景についての質問が多くなってきました・・・

背景のＣＳＳは以下を組み合わせて指定します

background-color 背景色
background-image 背景に画像
background-repeat 繰り返しを指定
background-attachment 背景画像の固定とスクロール
background-position 背景画像の位置

このブログのように背景にグレイの色を指定する場合は

body{
background-color:#cccccc; /*背景色*/
}

画像を敷き詰める場合は

body{
background-image:url(画像のＵＲＬ);/*背景に画像*/
}

画像を横方向にだけ繰り返す場合は

body{
background-image:url(画像のＵＲＬ);/*背景に画像*/

background-repeat:repeat-x;/*ヨコに繰り返し*/
}

画像を縦方向にだけ繰り返す場合は

body{
background-image:url(画像のＵＲＬ);/*背景に画像*/

background-repeat:repeat-y;/*タテに繰り返し*/
}

画像を1つだけ配置する場合は

body{
background-image:url(画像のＵＲＬ);/*背景に画像*/

background-repeat:no-repeat ;/*繰り返さない*/
}

画像を１つだけ左下に配置

body{
background-image:url(画像のＵＲＬ);/*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position: left bottom;/*左下に配置*/

}

↑上はわかりやすいようにサイドバー、メインを表示していませんが

↓実際のブログではブログに下に隠れてしまう場合があります

見ている方のディスプレイの解像度によっても見え方は違います

そこでframeと左サイドバーの背景色を透明にします

※この場合右サイドは関係ありませんが背景を右下に変更する場合もあるかもなのでついでに右サイドも透明にしてみます

#frame,
#sub_a,
#sub_b{
background-color:transparent;/*背景色を透明*/
}

スキンによっては、あるいはすでに別の背景を設定している場合は

これだけでは消えない場合もあります

スキンによってはフッターエリアがジャマになる場合があります

#footerArea{
background-color:transparent;/*背景色を透明*/
border:none;/*線を消す*/
}

背景色をグレイ

背景画像（透過）を左下に１つだけ配置

スクロールしても左下に固定

・・・・の、場合

body{
background-color:#cccccc; /*背景色*/
}
body{
background-image:url(画像のＵＲＬ);/*背景に画像*/
background-repeat:no-repeat ;/*繰り返さない*/
background-position:left bottom;/*左下に配置*/

background-attachment:fixed;/*スクロールしても位置固定*/
}
#frame,
#sub_a,
#sub_b{
background-color:transparent;/*背景色を透明*/
}

div#footerArea{
background-color:transparent;/*背景色を透明*/
border:none;/*線を消す*/
}

スクロールで動かす場合は

background-attachment:fixed;/*スクロールしても位置固定*/

これは必要ありません

背景をスクロールしたときに動かすか固定するかの違い・・・

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

background-attachment: fixed; スクロールしても動かさない

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

もう少し背景続きます・・・・

CSS　背景2

CSS　背景3