新デザインの変更⑦（ヘッダー半透明）改

アメブロカスタマイズ

新しいCSS編集用デザインを使って自分専用のオリジナルデザインにするための『ステップ⑦』です。

新デザインの変更③（ヘッダー半透明、タイトル色替え）
こちらの記事で行った、ヘッダーのカスタマイズを少しだけ変更して、ヘッダーを 980ｐｘ（固定）ではなく、横幅いっぱいに広げ、デザインの古さを解消するための手順がご覧になれます。

カスタマイズ前の準備

この記事を読む前に、こちらの設定をしておいてくださいね。

新デザインの変更①（CSS編集用デザインを適用する）

変更に失敗し元に戻したい場合、こちらの記事をご覧ください。

新デザインの変更（初期化用CSS）

カスタマイズ手順

『ブログ管理』画面を開きます。
https://blog.ameba.jp/ucs/top.do
『デザインの設定』ボタンをクリックします。

https://blog.ameba.jp/ucs/skin/skinselecttop.do
「デザインの変更」の「適用中のデザイン」にある『CSSの編集』をクリックします。
https://blog.ameba.jp/ucs/editcss/srvcssupdateinput.do
「現在使用中のプロぐデザインCSS」をスクロールし、下記のコードまで移動します。
/* skinHeaderArea ブログヘッダー980pxエリア */
.skinHeaderArea{
opacity: 0.80; /* 背景の透明度を変更（透過率20％）*/
background:#ffffff; /* 背景の色を変更 */
}
上記のコードを下記のコードで置き換えます。
```
/* skinHeaderFrameエリア */
.skinHeaderFrame{
  opacity: 0.80; /* 背景の透明度を変更（透過率20％）*/
  background:#ffffff;/* ←記事に背景を敷きたいとき */
}/* ←ブログヘッダーに背景画像を敷きたいとき */
```
コピー後、『保存』をクリックします。