最近使っているブラウザはGoogleのChrome。
軽くてサクサク動いてくれます。最近IE離れしてるかも・・・。
すごく便利で見ているHPの「要素を検証」すると、解析結果?のソースが見れてスタイルシートの設定値?も見れるのですごく勉強になります。
と、ここまでは裏ワザって話でもないんですけど(・ω・)
スタイルシートの勉強をしていて、IEとFireFoxで表示の結果が違って悩んでいました。
ChromeとFireFoxは同じ結果でIEが違っていて、Netscapeはまた全然違っていて・・・・。
とりあえずNetscapeの対応は捨てましたヽ(*'0'*)ツ
何が違うかというと、スタイルシートで
----------------------------------------------
.textbox {
border: solid 1px #808080;
width: 450px;
height: 295px;
padding: 0.5em;
overflow: auto;
background-image: url(textbg.jpg);
}
----------------------------------------------
というテキストBOXのようなものを作ったんです。
HTMLで使うときは
<DIV CLASS="textbox">
<P>ここに書いたことがBOX内に表示されます。<P>
<A HREF="HTTP://www.google.co.jp">Google</A>
<P>こんな風にリンクも貼れます。<P>
<IMG SRC="XXXX.JPG">
<P>画像も貼れます。<P>
<P>これは使えますよ^^<P>
</DIV>
※タグと解釈されると表示できなくなっちゃうから、"<>"は全角で書いてます^^;
このHPの中に出来た小窓がかわいいの♪
そこで、このかわいいテキストBOXのバックに絵を入れようとして最後に、
background-image: url(textbg.jpg);
この行を追加したんですよ。
ChromeとFireFoxは思った通りの結果で満足♪満足♪♪
IEはどうかなぁ?と見てみたら・・・・。
あれ?バックの絵が一緒にスクロールしてる!Σ(・ω・ノ)ノ!
なぜ?( ̄□ ̄;)
そこで!スクロールしないように
background-attachment: fixed;
を追加してみたらIEは思った通り♪
ChromeとFireFoxは?
あれ?バックの絵が消えてる?∑ヾ( ̄0 ̄;ノ
むむむぅ・・・・。バックの絵はどこにいったの?(ノ_-。)
調べたら、ブラウザ判定をしてCSSを切り替えるって方法があったんですよね。どのブラウザでアクセスしてきたかを判定してCSSを切り替えるだけなんですけど・・・。
でもここの一行以外は全部同じ表示がされているのに、
このテキストBOXだけのために、しかもたった1行のために判定することが面倒(汗)
で、見つけた裏ワザ。
background-attachment: fixed;
この行はIEだけのために必要だから、ここだけIEが理解してくれればいいんですよ。
なんと!全角スペースを行頭に入れるだけでOKということがわかりました!
たったそれだけです。(*゜▽゜ノノ゛☆
⊔⊔background-attachment: fixed;
□background-attachment: fixed;
とするだけでOK!これって楽チン!о(ж>▽<)y ☆
FireFoxとChromeはコードの前に全角スペースがあると、その行は無視しちゃうみたいです。
IEは全角・半角関係なく同じスペースとして扱ってくれているってことかな?
でも、これって邪道のような気がします。だって、ソース見ただけじゃ全然わからないんだもん。
アフィリエイト用のブログを立ち上げたはずなのに・・・。
すごく久し振りの書き込みです。いついらい?ってくらい更新していませんでした(大汗)
アフィリエイト用のブログを全面改定しようと思って、色々調べていたら全然違う方向へ進んでいまして、只今大変なことになっています。
というのも、どんな形がいいのかな?ってやりたい方向が見えてきたら、今の知識だけじゃ全然足りなくて、スタイルシート?のお勉強をやってます。
まだまだ全然わからないんだけど、FC2のブログってテンプレートを自分で色々といじれるのでスタイルを変えたりと試行錯誤してます。
そんな中で、面倒くさがりの性格が出てきてたのと、色々やりたいことが増えてきて(汗)
HTMLとスタイルシート、PHP、SQL、JavaSclipt、FLASH・・・。キャーーーーーー。
もう、訳わかりません(涙)
わたしはどこへ進もうとしているのでしょうか???
このまま全てマスターしたら、WEBデザイナーになれちゃうかもしれませんよ?
まぁ、マスターはできないと思いますけど。アフィリエイトサイトを作るより面白いからヤバイんです。
当初の目的から外れてしまってます(大汗)
すごく久し振りの書き込みです。いついらい?ってくらい更新していませんでした(大汗)
アフィリエイト用のブログを全面改定しようと思って、色々調べていたら全然違う方向へ進んでいまして、只今大変なことになっています。
というのも、どんな形がいいのかな?ってやりたい方向が見えてきたら、今の知識だけじゃ全然足りなくて、スタイルシート?のお勉強をやってます。
まだまだ全然わからないんだけど、FC2のブログってテンプレートを自分で色々といじれるのでスタイルを変えたりと試行錯誤してます。
そんな中で、面倒くさがりの性格が出てきてたのと、色々やりたいことが増えてきて(汗)
HTMLとスタイルシート、PHP、SQL、JavaSclipt、FLASH・・・。キャーーーーーー。
もう、訳わかりません(涙)
わたしはどこへ進もうとしているのでしょうか???
このまま全てマスターしたら、WEBデザイナーになれちゃうかもしれませんよ?
まぁ、マスターはできないと思いますけど。アフィリエイトサイトを作るより面白いからヤバイんです。
当初の目的から外れてしまってます(大汗)
アフィリ用のブログのレイアウトをちょっとだけ変更してみました。でも、なんだか見づらい(汗)
広告を減らそうと思ったら増えたよ(大汗)
色々試行錯誤しているけど、やっぱり難しいよ。
むむむぅ。。。記事書くのが苦手だから、長文書けないのよねぇ・・・・
ネタ探しは好調、更新は不調、アクセスは絶不調。
本当にくじけそうになるよぉ。
アフィリエイトって大半の人がくじけるって書いてあったけど本当にそう思う。でも、継続は力なりって言うし、諦めるにはまだ早い。
お小遣いサイトでちょこちょこ遊んでる方がお小遣いになるんじゃない?なんて思うこともあるんだけど、アフィリ用のブログから商品購入してもらうと一発大逆転なんだよねぇ。
相変わらず無料で商品がもらえる広告は感心が高いです。わたしも家族に頼んで全部取り寄せてみたし・・・アハハ
結構良いネタがあるらしい。お友達には喜んでもらってます。
興味のある方は ダイエットお得情報集 までどうぞ♪
広告を減らそうと思ったら増えたよ(大汗)
色々試行錯誤しているけど、やっぱり難しいよ。
むむむぅ。。。記事書くのが苦手だから、長文書けないのよねぇ・・・・
ネタ探しは好調、更新は不調、アクセスは絶不調。
本当にくじけそうになるよぉ。
アフィリエイトって大半の人がくじけるって書いてあったけど本当にそう思う。でも、継続は力なりって言うし、諦めるにはまだ早い。
お小遣いサイトでちょこちょこ遊んでる方がお小遣いになるんじゃない?なんて思うこともあるんだけど、アフィリ用のブログから商品購入してもらうと一発大逆転なんだよねぇ。
相変わらず無料で商品がもらえる広告は感心が高いです。わたしも家族に頼んで全部取り寄せてみたし・・・アハハ
結構良いネタがあるらしい。お友達には喜んでもらってます。
興味のある方は ダイエットお得情報集 までどうぞ♪
