FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか？

全体を半透明にして背景画像を表示する

全体を半透明にして背景画像を表示するカスタマイズを紹介します。

スタイルシートの末尾に以下を加えてください。

【standardシリーズの場合】

.base_table {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

【lightframeシリーズの場合】

#outline {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

各数値はお好みに合わせて調整してください。

filter:alpha
0（透明）～100（不透明）

-moz-opacity
opacity
0.0（透明）～1.0（不透明）

これでbodyに設定した背景画像が透けて見えるようになります。

関連記事

[ 2009/05/15 23:38 ] カスタマイズ共通カスタマイズ | TB(0) | CM(20)

≪ 記事要約を利用して表示時間を短縮する | HOME | プラグインの下を伸ばす (standardシリーズ) ≫

[ 4233 ] おおおおー!!!

きたー！ありがとうございます、ありがとうございます。
早速使わしてもらいます、わがブログがカッコよくなりました。ヽ(^◇^*)/
ほんとにありがとうございました。

[ 2009/05/15 23:49 ] [ 編集 ]

[ 4236 ] あれ？

すいません、連没で。
早速コレを適応したのですが、適応されていません。
テンプレ編集の、プレビューからは適応されているのですが、更新してみてみると適応されていません。
ブラウザなどが原因なのでしょうか?Fire fox使ってます。

[ 2009/05/16 00:09 ] [ 編集 ]

[ 4238 ] > そーいちさん

現状を確認したいのでURLを教えてください。

[ 2009/05/16 00:41 ] [ 編集 ]

[ 4248 ]

すごい勢いで充実してきましたね。
多分今一番充実してますよ。

しかし、新型ウイルス問題で、とうとう来週は会社
休みになりそうです。
もろ地域区なんで。
色々おこるもんでえす。

[ 2009/05/16 18:17 ] [ 編集 ]

[ 4249 ] いたお　さんへ

ごめんなさい、勘違いでした。なんだか適応されるのが遅かったらしくて。すいませんでした。

[ 2009/05/16 18:27 ] [ 編集 ]

[ 4250 ]

すみません、
filter:alphaを変えると、どこが変更されるのですか？
違いが分からないのでお聞きします。

[ 2009/05/16 19:26 ] [ 編集 ]

[ 4251 ]

↑↑透明度ですね。
０に近いほど透明度が濃く、１００に近いほど
透明度が薄くなります。
つまり、背景画像の表示濃度の調整帯です。

[ 2009/05/16 19:36 ] [ 編集 ]

[ 4255 ] 行を開けるには・・・。

共有プラグインなどを、書き換えて好きなプラグインを作りたいんですけど、（このブログのお薦めカスタマイズの所見ないに）行を開けるにはどうしたらよいのですか？
Enterキーを押して、１行開けようとしても、それが反映されないのですが・・。

[ 2009/05/16 20:49 ] [ 編集 ]

[ 4256 ]

ブラグインのhtmlレベルの改行は<br>タグを文の語尾にお付けると改行されます。

こんな感じ<br>

[ 2009/05/16 21:01 ] [ 編集 ]

[ 4272 ] > あなろぐさん、ニダーさん、雲と雲との隙間のPSP の管理人さん

あなろぐさん、ありがとうございます＾＾

ニダーさん、あなろぐさんが教えてくれた通り、それはIEの透明度です。ブラウザによって透明度の指定が違うのですが、filter:alphaはIEの透明度なんです。

雲と雲との隙間のPSP の管理人さん、あなろぐさんが教えてくれた通り、プラグインの行間には改行タグ<br />が必要です。改行したい箇所にこのタグを入れてください。

[ 2009/05/17 00:40 ] [ 編集 ]

[ 4287 ]

できました。ありがとうございます。

[ 2009/05/17 16:43 ] [ 編集 ]

[ 4302 ] > 雲と雲との隙間のPSP の管理人さん

できて良かったです。
教えてくれたあなろぐさん、ありがとうございました。

[ 2009/05/18 01:00 ] [ 編集 ]

[ 4319 ] 適応されません･･･

スタイルシートの本当に最後に加えたのですが、全く変化がありません･･･
入れるところを間違えたのでしょうか？？

/* Last update 2008-02-18 Template by FC2 */
.base_table {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

このような感じにいれましたが、違うのでしょうか？？

[ 2009/05/18 20:49 ] [ 編集 ]

[ 4322 ] > ミヤさん

この記事は当サイトが提供しているテンプレートを前提にしています。

URLを教えてもらえればそのテンプレートに対応したコードも解ると思います。

[ 2009/05/18 22:24 ] [ 編集 ]

[ 4351 ]

先ほど、スタンダードピンクをDLさせていただきました！
それで、このようにしたのですが、どうにも･･
プレビューしてもならないのです～･･･！

/*** その他 ***/
p { margin: 2px 0; }
ul { margin:2px 0 5px 0; padding:0; }
li { margin-left:20px; margin-bottom:3px; }
form { margin:0; }
table { font-size:10pt; }
.c-both { clear:both; }
.readmore { margin-top: 10px; }
.readclose { margin: 10px 0; }
.page_navi { margin:30px 0; font-size:9pt; color:#808080; }
.base_table {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

[ 2009/05/20 21:22 ] [ 編集 ]

[ 4360 ] > ﾐﾔさん

特に問題なさそうなのですが・・・
現状確認のためURLを教えていただけますか？

[ 2009/05/21 00:45 ] [ 編集 ]

[ 4372 ]

このブログになります～;;
なぜでしょうか～？;;;

[ 2009/05/21 21:41 ] [ 編集 ]

[ 4377 ] > ﾐﾔさん

それはstandardではなく、lightframeです。

#outline {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

としてください。

[ 2009/05/21 23:13 ] [ 編集 ]

[ 4379 ]

ああ～！すみません～；；
今変えたのですが変化がありません･･･何か違うのでしょうか？？

.c-both { clear:both; }
.readmore { margin-top: 10px; }
.readclose { margin: 10px 0; }
.page_navi { margin:30px 0; font-size:9pt; color:#808080; }
#outline {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

[ 2009/05/22 00:09 ] [ 編集 ]

[ 4383 ] > ﾐﾔさん

この記事はbodyに背景画像を設定したことを前提に書いてあります。

ﾐﾔさんは今#outlineに背景画像を設定しているので、これをスタイルシートの末尾に追加してください。

#center-left {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

#right {
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

または#outlineに設定している背景画像をbodyに設定してください。

[ 2009/05/22 01:09 ] [ 編集 ]

コメントの投稿