カスタマ:08
2007年01月20日(土曜日)
リクエストを頂きましたので、背景透過を消し、記事背景に画像を固定する方法を書きます。
どれくらい軽くなるかは判りませんが(^^ゞ
【方法】
まずは、背景透過を消します。
方法は、前の記事に書いてありますので、そちらを見てください。
背景画像のソースはコピーしておくと下の作業に便利です。
次に記事背景に画像を貼り付けます。
「スタイルシートの編集」内、
上でコピーしたソースを貼り付けると簡単です。
但し、紫文字の「a」を忘れずに追加してくださいね。
「background-attachment」は削除してください(あっても、反映はされませんけど)。
「50% 0%」は、記事内での画像位置を表します。
(↑は中央・上になります)
前%は左右、後%は上下です。
0%で左・上、100%で右・下になります。
お好きな位置に変えてください。
どれくらい軽くなるかは判りませんが(^^ゞ
【方法】
まずは、背景透過を消します。
方法は、前の記事に書いてありますので、そちらを見てください。
背景画像のソースはコピーしておくと下の作業に便利です。
次に記事背景に画像を貼り付けます。
「スタイルシートの編集」内、
div.entry-body {のソースを入れてください。
padding : 15px 10px 10px 45px;
background-image : url(http://blog-imgs-17.fc2.com/z/u/t/zuttoissyodayo2/08-r13a.gif) ;
background-repeat : no-repeat;
background-position : 50% 0%;
}
上でコピーしたソースを貼り付けると簡単です。
但し、紫文字の「a」を忘れずに追加してくださいね。
「background-attachment」は削除してください(あっても、反映はされませんけど)。
「50% 0%」は、記事内での画像位置を表します。
(↑は中央・上になります)
前%は左右、後%は上下です。
0%で左・上、100%で右・下になります。
お好きな位置に変えてください。
スポンサーサイト
カスタマ:08
2007年01月20日(土曜日)
背景が透過してあるので、表示が重いです。
(重いと判ってて作る鮎も鮎ですが…)
いろんな装飾(プラグインやブログペットなど)をされてる方は、特に表示が遅いことと思います。
そんな方は、透明化を削除するのも良いか、と思います。
表示が遅いのは、読者さんが尤も嫌がることだからねぇ~。
でも、背景画像がないと、ノッペリした画面になるのが、淋しいかも。
他にも方法はあって、
*クマ&ネコマークを透明(元から薄く)にして、記事背景に固定しちゃうって手もあるんですが、これだと、記事文字数(段数)が短いと、画像全部が記事枠に入りきらず切れちゃうこともあるので、組み込めなかったんです。
もし、この方法を試したい!って方がお見えでしたら、方法を載せますので、書き込んでくださいね(ご要望がないと、載せても仕方ないので…)。
*鮎のブログのようにすべてに背景色をつけないと、1番下の画像が出ます。
ただ、これも難点があって、画像位置がパソコンの画面の大きさによって変わるので、必ず記事の下に画像が来ない場合もあります。
それに全体が同じ色になって殺風景だしね。
とりあえず、透明化の削除方法を下記に書きましたので、参考に。
【方法】
「スタイルシートの編集」内、
消すと、背景が白くなるので、背景色を付けたい方は、「スタイルシートの編集」内、
薄~い色がベストです。
但し、透過してない画像もありますので、ご注意を。
(重いと判ってて作る鮎も鮎ですが…)
いろんな装飾(プラグインやブログペットなど)をされてる方は、特に表示が遅いことと思います。
そんな方は、透明化を削除するのも良いか、と思います。
表示が遅いのは、読者さんが尤も嫌がることだからねぇ~。
でも、背景画像がないと、ノッペリした画面になるのが、淋しいかも。
他にも方法はあって、
*クマ&ネコマークを透明(元から薄く)にして、記事背景に固定しちゃうって手もあるんですが、これだと、記事文字数(段数)が短いと、画像全部が記事枠に入りきらず切れちゃうこともあるので、組み込めなかったんです。
もし、この方法を試したい!って方がお見えでしたら、方法を載せますので、書き込んでくださいね(ご要望がないと、載せても仕方ないので…)。
*鮎のブログのようにすべてに背景色をつけないと、1番下の画像が出ます。
ただ、これも難点があって、画像位置がパソコンの画面の大きさによって変わるので、必ず記事の下に画像が来ない場合もあります。
それに全体が同じ色になって殺風景だしね。
とりあえず、透明化の削除方法を下記に書きましたので、参考に。
【方法】
「スタイルシートの編集」内、
body {の打消線部分をすべて消してください。
filter:Alpha(opacity='88');
color : #774d40;
background-color : #e7decd;
text-align : center;
line-height : 1.5;
font-size : x-small !important;
voice-family : "\"}\"";
voice-family : inherit;
font-size : small !important;
margin: 0px;
padding: 0px;
background-image : url(http://blog-imgs-17.fc2.com/z/u/t/zuttoissyodayo2/08-r13.gif) ;
background-repeat : no-repeat;
background-position : 30% 100%;
background-attachment : fixed;
}
消すと、背景が白くなるので、背景色を付けたい方は、「スタイルシートの編集」内、
div#container {の赤文字部分を好きな色コードに変えてください。
width : 850px;
margin-top : 0px;
padding-top : 0px;
background-color : #ffffff;
border-left : solid 2px #938359;
border-right : solid 2px #938359;
border-bottom : solid 2px #938359;
}
薄~い色がベストです。
但し、透過してない画像もありますので、ご注意を。
Copyright (C) 2006 *TENTEN★くらぶ* rights reserved.
Template&Material : TENTEN★くらぶ
わんこ写真:Digital Image Studio 410319【ふぉとさいく】