ブラウザ別のCSSの読み込み

[新着] Webテンプレートを仮オープンしました



0   名前: 麻那 : 2006/01/12 22:45
ブラウザによりCSSを振り分ける為、「css_junction.js」というファイルを読ませ
ブラウザにあったCSSを読み込ませようしておりますが、
下記の状態ですとうまく動作せずスタイルシートがかかりません。
(WindowsでIE環境)

−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
<head>
 :
<script language="JavaScript" type="text/javascript" src="common/js/css_junction.js"></script>

<link href="common/css/mac-ie.css" rel="stylesheet" type="text/css">
<link href="common/css/mac-ns.css" rel="stylesheet" type="text/css">
<link href="common/css/win-ie.css" rel="stylesheet" type="text/css">
<link href="common/css/win-ns.css" rel="stylesheet" type="text/css">
</head>

−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
win-ieを一番下に並び替えるとWindowsのIE環境ではCSSが有効になるのですが、
単純にCSSのリンクを読み込む順番で最後に読み込んだものが有効になってしまうのでしょうか?


「css_junction.js」
function MM_reloadPage(init) {
if (init==true) with (navigator) {
if ((appName=="Netscape")&&(parselnt(appVersion)==4)) {
document.MM_pgW=innerWidth;
document.MM_pgH=innerHeight;
onresize=MM_reloadPage;
}
}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

var ie = (navigator.appName=="Microsoft Internet Explorer");
var ns = (navigator.appName=="Netscape");
var Mac = (navigator.appVersion.indexOf("Mac") !=-1);

url = "../css/";
if (Mac) {
if (ie) style="mac-ie.css";
if (ns) style="mac-ns.css";
} else {
if (ie) style="win-ie.css";
if (ns) style="win-ns.css";
}
document.write('<link type="text/css" rel="stylesheet" href"'+url+style+'">');

1   名前: you : 2006/01/12 22:45
私も今猛勉強中なのですが
CSSは、後から読み込んだものが上書きされて表示するんじゃないのでしょうか
パージョンは、分からないのですが

mac-ie mac-ns win-ie6.0 win-ns この辺は、分けなくてもCSSの書き方で
対応できるかと思いますが?

私は、IE5.0 5.5用の2種類を書いているのですが
ページから1つ目のCSSファイルを読み込み表示
link href="style/design.css"

そのファイルの中に
@charset "Shift_JIS";

@import "base.css";

@media tty {
i{content:"\";/*" "*/}} @import 'ie5win.css'; /*";}
}/* */

メインは、base.cssを読み込み
IE5.0と5.5は ie5win.css を読み込むように設定しています。
もし参考になればと思い書き込みました。

2   名前: S : 2006/01/12 22:45
 この辺りが参考になるのでは。

http://dhr.at.infoseek.co.jp/stylebug2.htm
http://www.t3.rim.or.jp/~harunaga/css/
http://hp.vector.co.jp/authors/VA010341/css.html

 important指定による振り分けも必ずしもうまくいくとは限らないので注意。

3   名前: 56 : 2006/01/12 22:45
>>0 スクリプトで書き出したlink要素を上書きしたら意味ない。

一覧へ戻る