ブログの背景画像

年末になるとする事もなくて暇になるためでしょうか、カスタマイズするのが習慣みたいになってしまいました。 今年も触ってしまいましたが、ゴチャゴチャして見づらくなったととの声も聞かれるのですが・・・。

私自身もそのように感じています。 ただ、ボケ防止の一策でもあるカスタマイズなので、しばらくはこの画面で行こうと思います。 春になったら変わっているかもしれません・・・ね。

【メモ】
1 ヘッダーの画像の大きさを変更
  幅を枠線の分(4px)小さくし、高さを110px縮小
2 タイトル(西海からの潮風)にシャドウを付け、サブタイトルも同様に変更 (IEは未対応)
3 外枠の隅を丸くして影を付けた(IEは未対応)

※CSSの変更

body {
background-color: #dcdcdc;
color: #135d66;
background-image: url("http://blog-imgs-45.fc2.com/s/a/i/saikai1948/topbg-winter.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-size:cover;

text-align: center;
font-family: Helvetica, "メイリオ", "MS Pゴシック", "ヒラギノ角ゴ Pro W3", Osaka, Arial, sans-serif;
font-size: small;
voice-family: "\"}\"";    
voice-family: inherit;
font-size: small;
}

_________________________________________

div#wrapper {
  width: 1000px;
  margin: 20px auto;
  background-color: #f3fffc;
  
  -webkit-border-radius: 15px 15px 15px15px/15px 15px 15px 15px;
  -moz-border-radius: 15px 15px 15px 15px/15px 15px 15px 15px;
  border-radius: 15px 15px 15px 15px/15px 15px 15px 15px;


  -webkit-box-shadow: 0px 0px 19px #000000;
  -moz-box-shadow: 0px 0px 19px #000000;
  box-shadow: 0px 0px 19px #000000;
  border: 1px solid #696969;

}

div#header {
width: 996px; height: 220px;
background-image: url("http://blog-imgs-47.fc2.com/s/a/i/saikai1948/header_winter.jpg");
background-repeat: no-repeat;
background-size:auto;
border: 2px solid #ffffff;

-webkit-border-radius: 15px 15px 0px 0px/15px 15px 0px 0px;
-moz-border-radius: 15px 15px 0px 0px/15px 15px 0px 0px;
border-radius: 15px 15px 0px 0px/15px 15px 0px 0px;

margin-bottom: 25px; }

_________________________________________

div#header h1 {
font-size: large;
text-align: left;
padding-top: 150px; padding-left: 740px;
text-shadow : 2px 2px 2px green,
-2px 2px 2px green,
2px -2px 2px green,
-2px -2px 2px green;

}

div#header h1 a {color: #fffafa;
text-decoration: none;
}

#introduct { color: #fffafa;
text-align: left;
margin:0px 10px 2px 740px;
text-shadow : 2px 2px 2px blue,
-2px 2px 2px blue,
2px -2px 2px blue,
-2px -2px 2px blue;
}




※変更前の記述

div#header {
width: 1000px; height: 330px;
background-image: url("http://blog-imgs-47.fc2.com/s/a/i/saikai1948/header_winter.jpg");
background-repeat: no-repeat; background-size:auto; border: 2px solid #ffffff;
margin-bottom: 25px; }


/* Header
------------------------------------------------------------ */

div#header h1 {
  font-size: large;   
        text-align: left;
  padding-top: 260px;   padding-left: 740px;
 }

div#header h1 a {color: #fffafa;
        text-decoration: none; }

#introduct { color: #fffafa;
  text-align: left;
  margin:0px 10px 2px 740px;
}



スポンサーサイト
     

コメント

Secret

     
カレンダー
05 | 2017/06 | 07
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -
ホームページ
プロフィール

チャッピー

名  前:チャッピー
誕生日:2000年8月13日
性  別:男性
趣  味:散歩(最近は昼寝)
特  技:お座り、お手&待て!

メール ・ 管理画面
カウンター
今日の天気&予報

※日本気象協会(tenki.jp)

最新記事
月別アーカイブ
〖日付の古い順で表示します〗
カテゴリ
〖日付の新しい順で表示します〗
リンク
ブログ内検索
RSSリンクの表示