- ベストアンサー
IE用と、その他のCSSを条件分岐
お世話になっています。 IE用と、その他のCSSを条件分岐させるために 以下の用にやったのですが その他のfirefoxなどもIE用（wholerulesie）のスタイルシートになってしまいます。 どこが悪いのでしょうか？ <link rel="stylesheet" type="text/css" href="wholerules.css" /> <!–[if IE 8]> <link rel="stylesheet" type="text/css" href="wholerulesie.css" /> <![endif]–>
- kawa214
- お礼率11% (35/313)
- HTML
- 回答数3
- ありがとう数0
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
No1です。 ＞ちなみに、Dreamweaverを作っているのですがこの３行が灰色になってしまいます。 <!-- から --> までは、HTMLの文法ではコメントなので、灰色になるのが正常です。 IEは、コメントの中まで読んで、特定の形式のコメント (<!--[if IE]とか) の場合にコメントの一部をコメントで無いと解釈するようになってます。つまり <link rel="stylesheet" type="text/css" href="wholerulesie.css" /> を有効なタグと見なします。 他のブラウザは、<!-- から --> までをすべて無視します。 ＞今度は、逆にfirefoxがIE用のスタイルシートになってしまうのですが…。 なので、これはあり得ません。なんらかの勘違いでしょう。
関連するQ&A
- Macfirefox3とMacfirefox2以下でCSSを切り替えたい
MacのFirefox3は、Firefox2までとはデフォルトフォントサイズが 違うので、Firefox3とそれ以外のFirefoxで分けたいです。 今まで、CSSを以下のスクリプトでブラウザ別に分岐していました。 MacのFirefox3の分岐を増やしてみたのですが、それ以外のFirefoxのCSSに 分岐されてしまいます。 あまりJavascriptに明るくないので、 どうしてわかれてくれないものか困っています。 どうぞお知恵をお貸し下さい！ ↓以下、かいてみたソースです。 var Win=(navigator.userAgent.indexOf("Win")!=-1); var Mac=(navigator.userAgent.indexOf("Mac")!=-1); var Explorer=(navigator.appName.indexOf("Explorer")!=-1); var Firefox=(navigator.userAgent.indexOf("Firefox") !=-1); var Netscape=(navigator.appName.indexOf("Netscape")!=-1); var opera=(navigator.userAgent.indexOf("Opera")!=-1); var safari=(navigator.userAgent.indexOf("Safari")!=-1); var Version=navigator.appVersion.charAt(0); if(safari){ document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">'); } else if(Win && Explorer && Version=="6"){ document.write('<LINK rel="stylesheet" href="/css/win_ie.css" type="text/css">'); } else if(Win && Firefox){ document.write('<LINK rel="stylesheet" href="/css/win_ie.css" type="text/css">'); } else if(Win && opera){ document.write('<LINK rel="stylesheet" href="/css/win_ie.css" type="text/css">'); } /*増やしたところ*/ else if(Mac && Firefox && Version=="3"){ document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">'); }/*増やしたところ終わり*/ else if(Mac && Firefox){ document.write('<LINK rel="stylesheet" href="/css/mac.css" type="text/css">'); } else if(Mac && opera){ document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">'); } else if(Win && Netscape && Version=="4"){ document.write('<LINK rel="stylesheet" href="/css/win_nn.css" type="text/css">'); } else if(Mac && Explorer && Version=="5"){ document.write('<LINK rel="stylesheet" href="/css/mac_safari.css" type="text/css">'); } else if(Mac && Netscape && Version=="7"){ document.write('<LINK rel="stylesheet" href="/css/mac.css" type="text/css">'); } else if(Mac && Netscape && Version=="4"){ document.write('<LINK rel="stylesheet" href="/css/mac.css" type="text/css">'); } else{ document.write('<LINK rel="stylesheet" href="/css/font.css" type="text/css">'); }
- ベストアンサー
- JavaScript
- フォントのサイズが変わってしまいサイトが崩れる
IEとファイヤーフォックスでフォントのサイズが変わってしまい、自作サイトが崩れてしまいます。 調べたところ下記のような情報があったのですが、この方法がよいのでしょうか？ http://kudox.jp/html-css/font-size-css また上記通りにする場合下記は <link rel="stylesheet" type="text/css" href="/css/fontsize.css" media="all" /> <!--[if IE]> <link rel="stylesheet" type="text/css" href="/css/fontsize_ie.css" media="all" /> <![endif]--> 最優先させるのでしょうか？最優先なら下記のような感じでよいのでしょうか？ <link rel="stylesheet" href="reset.css" type="text/css" /> <link rel="stylesheet" href="base.css" type="text/css" /> <link rel="stylesheet" href="page.css" type="text/css" /> <link rel="stylesheet" type="text/css" href="/css/fontsize.css" media="all" /> <!--[if IE]> <link rel="stylesheet" type="text/css" href="/css/fontsize_ie.css" media="all" /> <![endif]--> またmedia="all"はとりあえずすべてにつけておいたほうがよい属性と考えてよいのでしょうか？ 教えてください。
- ベストアンサー
- HTML
- ie8メディアクエリによるcss分岐ができない
ie8でメディアクエリによるcssの画面サイズ分岐ができなくて困っています。 環境は、windows XP Service Pack3です。 1.下記方法でIE8以下にもHTML5とメディアクエリを使えるようにしました。 (HTML5はバリデータでチェック済みです。) <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script> <![endif]--> 2.下記方法でデバイスの横幅に対応したcssを指定しました。 <link href="smartphone.css" media="screen and (max-width:480px)" rel="stylesheet" type="text/css"> <link href="tablet.css" media="screen and (min-width:481px) and (max-width:1024px)" rel="stylesheet" type="text/css"> <link href="pc.css" media="screen and (min-width:1025px)" rel="stylesheet" type="text/css"> 3.現象 a. firefoxではローカル上のページもサーバー上のページも適用されていました。 b. ipodではサーバー上のページしか見ていませんが、適用されていました。 c. しかし、ie8ではローカルでもサーバーにアップしてもcssが適用されません。 d. ie8では、media="screen"だけの場合は適用されていますが、and以降のサイズ指定が入ると適用されません。 e.type=などの指定もアリ、ナシどちらの組み合わせも適用されません。 よろしくお願いいたします。
- ベストアンサー
- CSS
- コンディショナルコメントの正しい記述方法を教えてください。
個人的にDreamweaverCS3を使ってHPを制作しているのですが、今まではハックを利用していたのですが、コンディショナルコメントというものを知りそれを利用してHPを作りたいと考えているのですが各説明サイトをみて試したのですが、HTMLの<head></head>間に以下のような記述をしても認識してもらえないのですがどうしてなのでしょうか？ --------------------------------------------------------- <!--[if IE 7]> <link rel="stylesheet" type="text/css" href="ie_6.css" /> <![endif]--> <!--[if lte IE 6]> <link rel="stylesheet" type="text/css" href="ie7.css" /> <![endif]--> <!--[if !IE]>--> <link rel="stylesheet" type="text/css" href="other.css" /> <!--<![endif]--> -------------------------------------------------------------- ※ちなみに最後の一つだけは認識するようなのです。 <!--[if IE 7]><![endif]-->この記述は必要なのでしょうか？そしてこれはコードなのでしょうか？コメント扱いなのでしょうか？ 周りにまったくHTMLをわかる人がいないのでご助言を頂けたらと思います。よろしくお願いいたします。
- ベストアンサー
- その他([技術者向] コンピューター)
- CSS のときのヘッダの記述
<link rel="stylesheet" href="style.css" type="text/css" /> の link rel = の ●「 rel 」って何の省略なのでしょうか？ また、 ●href は Hyper link REFerence の略でしょうか？
- ベストアンサー
- HTML
- IEのセキュリティにブロックされないようにするには
皆さん、お力をお貸し下さい。 javascriptで以下のようなプログラムを持つウェブページを作成しているのですが、IEのセキュリティ保護（セキュリティ保護のため、コンピュータにアクセスできるアクティブ コンテンツは・・・）に引っ掛かってしまいます。このプログラムにウィルス等の脅威が含まれないことを示してブロックされにくくするといったことは出来ないでしょうか？全てのjavascriptがブロックされる訳ではないようですが、不勉強なもので、ブロックされる場合とされない場合の差が分かりません。妙案お授け下さいます様、お願い致します。 <script type="text/javascript" language="JavaScript"> <!-- today=new Date(); allseconds=today.getTime(); surplus=Math.floor(allseconds/(24*60*60*1000)); flag=surplus%5; style=new Array(5) style[0]='<link href="index_style/style01.css" rel="stylesheet" type="text/css">'; style[1]='<link href="index_style/style02.css" rel="stylesheet" type="text/css">'; style[2]='<link href="index_style/style03.css" rel="stylesheet" type="text/css">'; style[3]='<link href="index_style/style04.css" rel="stylesheet" type="text/css">'; style[4]='<link href="index_style/style05.css" rel="stylesheet" type="text/css">'; document.write(style[flag]); //--> </script>
- ベストアンサー
- JavaScript
- CSSで、外部スタイルシートを2つ指定した場合。
たとえば、 <link href="style.css" rel="stylesheet" type="text/css"> <link href="info.css" rel="stylesheet" type="text/css"> のように２つスタイルシートを指定した場合、同じ内容のスタイルシートを書き込んだ場合どちらが優先されるのでしょうか。
- ベストアンサー
- HTML
- インラインフレーム内のcssを親フレームに適用する
インラインフレーム（子ウィンドウ）に表示されているページ（同一ドメイン上のページです）で読み込まれているcssを、ページ読み込み時に親ウィンドウ側でも読み込みたいと思っています。 内容としては 親ウィンドウ側css呼び出し部分 <link rel="stylesheet" type="text/css" href="test.css"> <link rel="stylesheet" type="text/css" href="test1.css"> 子ウィンドウ側css呼び出し部分 <link rel="stylesheet" type="text/css" href="test.css"> <link rel="stylesheet" type="text/css" href="test2.css"> となっているソースをページ呼び出し時に 親ウィンドウ側css呼び出し部分 <link rel="stylesheet" type="text/css" href="test.css"> <link rel="stylesheet" type="text/css" href="test2.css"> 子ウィンドウ側css呼び出し部分 <link rel="stylesheet" type="text/css" href="test.css"> <link rel="stylesheet" type="text/css" href="test2.css"> のように共通していないcssを子ウィンドウ側に合わせて変更したいのです。 子ウィンドウ内のページのソースは訳があって編集する事が出来ないので、親ウィンドウ側で子ウィンドウ内の <link rel="stylesheet" type="text/css" href="test2.css"> の href の値を読みこみ、親ウィンドウ側の href の値を置き換えるといった方法では無いかと思うのですが、具体的にどうすればよいのか分かりません。 どなたかご存知の方、ご教授ください。 よろしくお願いいたします。 また、ブラウザはIE6～8と、Firefoxを想定しています。
- ベストアンサー
- JavaScript
- 勝手に他のcssが適用されることはあり得ますか？
<link rel="stylesheet" type="text/css" href="○○.css"> としていないのに、勝手に他のcssが適用されることはあり得ますか？ FC2の無料版です。
- ベストアンサー
- CSS
- CSSのスタイルシート適用について
<link href="/○○○.css" rel="stylesheet" type="text/css"> としてスタイルシートを呼び出した後に、再び <style type="text/css"> と記述してスタイルのいくつかを再設定することはできるんでしょうか？その場合はその宣言したものだけが変わって、ＬＩＮＫされたほうのスタイルシートデータも他の内容は生き残って適用されますか？
- ベストアンサー
- HTML
補足
お返事ありがとうございます！ 早速 <!--[if IE 8]> <link rel="stylesheet" type="text/css" href="wholerulesie.css" /> <![endif]--> と、やってみましたが 今度は、逆にfirefoxがIE用のスタイルシートになってしまうのですが…。 ちなみに、Dreamweaverを作っているのですが この３行が灰色になってしまいます。