2008年07月22日
★Cool にソラマメブログの衣替え! -Case.2-
【第 45 話】 透け透けビキニのようなブログに着替えてみる!- スタイルシート編集編 -
★いよいよ、ニッポンの暑い夏、キンチョーの夏がやってまいりました。ブログのトップに重たげで暗い画像を載っけてるそこのキミ!セカンドライフでは透け透けビキニがゴマンと売られてんだから、この際、見た目涼しげな画像に着替えましょ。- by Lovely Wolf -
# J Style *** by Jupi Noel ***
<SL url> secondlife://Fashion Center/162/114/22

★お友達成約率100% を誇るオレの申し込みが見事に玉砕されてしまったデザイナーのJupi Noel さんの名前をGoog ってみた。
・・・お!彼女のブログを見つけたゾ。しかも、ソラマメにいるし。

★えっ!!!Jupi さんって、日本人なのか?・・・先日のオレの記事を見たら、許してねぇ。
# J Style ***by Jupi Noel***
<SL url> http://jstyle.slmame.com/

★とにまぁ、女性のお洋服のことばかりで頭がいっぱいってどういうこと?
・・・夏休みとともに、日本にも暑い夏が到来したからには、オレがこの題材を講義に取り上げることで、必ずや全国数千万のセカンドライフブログファンの体感温度を約10 度下げることに成功するはずだ。
して、本日のお題は、「透け透けビキニのようなブログに着替えてみる!」だそうです。乳首モロ見えを覚悟の上で、お読みください。
★手法その1
<div class="sample">~</div> で囲んだ部分は、透け透け度75%になってくれる。
.sample {
filter: alpha(opacity=75);
-moz-opacity:0.75;
opacity:0.75;
}
★手法その2
これは、画像を透け透けにする方法だ。
head-img とは、オレのブログ「Lovely Wolf Report in SLMaMe」のロゴを<div id="head-img">~</div> で囲んだ部分のこと。
・・・究極の透け透け度15%をマークした。
#head-img img{
filter: alpha(opacity=15);
-moz-opacity:0.15;
opacity:0.15;
}
★手法その3
・・・もともとスタイルシートに設定されている<div> タグの領域の背景色を取り除くことでも、当然のごとく透け透けビキニにすることができる。
・・・赤字部分が修正ヶ所。background(背景)をコメントアウトしてみる。(/*~*/ で囲む)
.blogbody{
/* background :#fff; */
margin :0px 0px 10px 0px;
padding :8px;
border-left :1px solid #484848;
border-right :1px solid #484848;
border-bottom :1px solid #484848;
}
#links{
width:185px;
float: right;
text-align :left;
margin :39px 10px 0px 0px;
padding :0px 0px 0px 10px;
/* background :#fff; */
overflow:hidden;
}
・・・他にも触る必要があるかもしれないが、あくまでも事例のひとつとして参考にしてくれ。もちろん、リクエストしてくれれば、夜の診察室で特別に診てあげますよ。
# Tips 1.ソラマメでは、テンプレートの各領域に対して次のような名前が指定されている。
<div id="container">~<div> ・・・・・・・上部画像領域+記事本体+コメント+トラックバック
<div id="banner">~<div> ・・・・・・・・・上部画像領域
<div id="content">~</div>・・・・・・・・・記事本体+コメント+トラックバック
<div id="links">~</div>・・・・・・・・・・・・サイドバー
<div class="blogbody">~</div>・・・・記事本体
# Tips 2.テンプレートを修正するときは、サイドメニュー「ブログの設定」-「テンプレート」を選んでから、「カスタマイズ」(赤アミ部分)をクリックする。

Posted by Lovely Wolf at 12:25│Comments(0)
│【画像/撮影】