![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
今サイトを作成しています。
HTML、CSSをはじめて1年の初心者です。
ブラウザは普段基本的にFirefoxを使用しています。
サイトの表示確認をFirefoxとIE7で行っているのですが2つのブラウザで微妙に表示がずれてしまいます。
色々調べてJavaScriptでブラウザを判別させてそれぞれに対応したページを用意するようなことが書かれていたんですがいまいちやり方がよくわかりません、、
やり方知ってる方助けてください。
もしくは他の対処法があるんでしたら教えていただけると助かります。
よろしくお願いします。
No.3ベストアンサー
- 回答日時:
ブラウザによる表示の違いを解決(緩和する)方法としては、
おっしゃっているとおり、
1.ブラウザによって違うCSSを読ませる
のほかに、
2.ひとつのCSSをできるだけ差がないようにして使う
が考えられると思います。
-----------------
1の方法としては、
「IEのみにCSSを読ませる」
http://www.google.com/search?hl=ja&q=if+ie+css&b …
と、
「IEハックとよばれる方法(CSSの一部分でIEのみに読み込ませる)」
http://www.google.com/search?&hl=ja&q=ie+%E3%83% …
また、基本的には上のふたつは、やろうと思えばどちらも同じことをできます。ですので、どちらかを使えるようになればいいでしょう。
基本的には、Firefox,Operaは結構似た表示をしてくれますが、IEだけが駄目、ということが多く、そのような場合は上の方法のどちらかを使うといいと思います。(FirefoxとOperaで違うCSSを使いたい場合、などで初めてJavascriptを使う必要があるかと...)
---------------
2の方法としては、ブラウザ間の表示の微妙な差異を吸収してくれる、
Yahooが提供しているreset.cssを使う方法があります。
http://developer.yahoo.com/yui/reset/
の、オレンジ色の枠の中の、"Download"のリンクからダウンロードして、
中にたくさん入っていますが、その中からreset.cssというファイルを見つけてください。
これを普通のcssと同じように読みこませれば、適用できたことになります。
ただし、これだけでは解決しないと思いますが...
詳細は
http://www.google.com/search?hl=ja&q=yui+css&btn …
---------------
私の場合は、できるだけひとつのCSSで同じように見えるようにがんばり、
この○○IEめ、と嫌になってたときは、あきらめて
IEハックか、IEだけにCSSを読ませる方法をとっています。
回答ありがとうございます!
Yahooが提供しているreset.cssは初めて知りました!
一応ダウンロードしてみたので状況に応じて使ってみたいと思います。
私もaltrnさんのようにできるだけひとつのCSSで同じように見えるようにがんばってみます。
この○○IEめ、となったときは1の方法を使おうと思います^^;
知ってて損はなさそうなのでお勉強したいと思います!
まだまだ勉強不足ですね^^;
がんばります。
No.5
- 回答日時:
No3で回答させていただいた者(altrn)です。
「補足要求」にしてしまったのは私のミスです。すみません、お気になさらず。
せっかくなので追記です。
ブラウザ間の見え方の差異を一度に確認してくれるサービスがあります。
以下のページなどで紹介されていますので、ご参考になれば。
http://www.techdego.com/2007/01/capture.php
http://gigazine.net/index.php?/news/comments/200 …
頻繁にはつかうものでもないと思いますが、
紹介されているサイトのうち、私は以下のサイトを利用しています。
http://browsershots.org/
もちろんすべてにチェックすると時間もかかるので、
特に日本で使われているブラウザ
IE(5.5,6,7),Firefox(1,2,3),Opera(9最新版),Safari(3.0,3,1)
のうちの、
Windows,Mac,Linux
くらいにチェックすれば十分ではないかとは思います。
はじめたばかりとのことで、
あまり情報が与えられすぎても
やることが増えすぎて大変かもしれませんが、
ご参考になれば幸いです。
追記までわざわざありがとうございます。
こんなサイトがあるんですね^^
あたしも試してみたいと思います!
2回もお答えいただいてありがとうございました^^
No.4
- 回答日時:
私は、HPの表示チェックはIE5.5で使用してしていますが。
ルビ 縦書きを使用のためですが。
下記参考URLを参考に作成ました。
必要の項目を抜き出して使用しています。
使用例では、IEでFirefox等を使用の場合は警告メーセージ等もだしていますが。
参考までに、IE5.5とIE7でも表示が異なりますよ。
参考URL:http://www.kisc.meiji.ac.jp/~pz03013/html/css_ch …
No.2
- 回答日時:
ブラウザの判別方法は回答出ているようなので、別の視点から。
IE7への対応は不要です。
Microsoft自身、IE7は切り捨てました。
今から行うのなら、FireFoxとIE8で確認しましょう。
IE8ではW3Cの定める標準仕様に沿った形で実装され、それが標準になっています。
IE8にはIE7互換モードという物があり、これはIE7向けにページを作ってしまった残念なページを表示するためだけに存在します。
IE7自体不具合が多く、殆ど普及していませんので、IE7に合わせたページを作る意味が有りません。(IE7が標準になっているVistaも普及していませんし。)
わかりやすい回答ありがとうございます。
今調べてみたんですがIE8は今ベータ版なんですよね?
正式版はもうすぐでるんでしょうか?、、
でるなら正式版になってからダウンロードしてもいいかと思いまして。。
No.1
- 回答日時:
ご参考
http://pzxa85.hp.infoseek.co.jp/www/wwwjsx29.htm
navigator.appVersion を確認すると、使用しているブラウザの種類がわかります。
ご質問者様が経験なされたように、表示上の微妙なずれを、ブラウザ毎に、HTMLを書き分けて表示内容を一致させることができます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
アプレット XXXXXX notinited ...
-
<IMG>のALIGN属性値「absmiddle...
-
プルダウン(リストボックス)の...
-
いずれ、HTMLのHPは見れ...
-
tabキーによるfocusの当たり方...
-
HTML4.01のままの弊害
-
DOCTYPE
-
掲示板からIPアドレスってど...
-
AfterEffectsでイージーイーズ...
-
XMLを作成してもタグしか表示さ...
-
<br />タグの、brの後の半角ス...
-
ジャケットの革の素材がわかり...
-
aviutlで最後まで動画が読み込...
-
<br style="clear:both;">って...
-
ブラウザでのタイ語の改行について
-
Hタグを改行禁止にしてspanのよ...
-
H1タグに改行の<br>を使う
-
動画の音づれについて
-
HTML 全画面表示 リンク先の...
-
_blank?_brank?
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
GoogleChromeでレイアウトが左...
-
<IMG>のALIGN属性値「absmiddle...
-
WindowsとMacでのChromeのスタ...
-
プルダウン(リストボックス)の...
-
doc As HTMLdocumentのコンパイ...
-
VBA オブジェクトが必要です
-
HTMLのバージョンの確認方法は?
-
tabキーによるfocusの当たり方...
-
Macで見るとページが崩れます。
-
スマホでページ内リンクができない
-
WEBページからのメッセージをVBAで
-
HTML文書を上書き保存してもブ...
-
Shift-JISでxml宣言するべき?
-
webページの有効期限が切れてい...
-
動く顔文字はブラウザ選びますか?
-
DOCTYPE宣言はしなくていいの?
-
CSSやJavaScriptのバージョン指定
-
いずれ、HTMLのHPは見れ...
-
主要ポータルサイトの多くがス...
-
Webページのレイアウトが崩れて...
おすすめ情報