- ベストアンサー
ＣＳＳとMacの関係
kokucho81の回答
- kokucho81
- ベストアンサー率61% (157/255)
根本的なところで、なぜ ptで大きさを指定しているのでしょう？ ptはプラットフォームごとに大きさが違います。CSSで指定している意味が半減するのではないでしょうか？ px指定であれば絶対的大きさのため、MACとWINDOWSを分ける必要性はなくなると思うのですが。 MACとWINDOWSで文字の大きさ自体を分けたいのならごめんなさいね。
関連するQ&A
- CSSの記述
HTMLで普通のテキストのサイズを固定したいのですが、 うまくいきません。 何が間違っているのでしょうか。 一部のHTMLだけ、リンクの下線をはずしたいので、 HTMLに <LINK REL="stylesheet" HREF="css/style_win.css" TYPE="text/css"> <STYLE TYPE="text/css"> <!-- A { text-decoration: none; font-size: 10pt;} --> </STYLE> と記述。 こちらの方は大丈夫です。 だめなのは外部 css/style_win.css に body { font-size:10pt } と書いたほうがまったく制御していません。 初心者で、本もたくさん調べましたが わかりません。 どうかお願いいたします。
- ベストアンサー
- HTML
- 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
- スタイルシートでの文字サイズ指定について
ホームページの文字表示サイズについての質問です。 私は全てWindows Vistaのメモ帳で作っているのですが、文字サイズを <Font Size="サイズ"> で指定するやり方では、ＭＡＣで有効ではないと分かり、スタイルシートの外部から引き出すやり方で、まずs.cssに、 BODY { font-size: 13px } と書き、index.htmlに <head> <style Type="text/css"> <!-- body,td {line-height:15pt;} --> </style> <link href="s.css" rel="stylesheet" type="text/css"> </head> と打ち込んでみました。 しかし、こうするとMacX10.5では文字化けを起こしてしまいました。 <link href="s.css" rel="stylesheet" type="text/css"> を挿入するやり方がどこかおかしいのでしょうか。 または、文字サイズの指定のやり方が、他にもあるのでしょうか。お手数かと思いますが、どうかお助けください。
- 締切済み
- HTML
- HPの文字の大きさを変えるCSSがうまくいきません
ネット上によく出ているjsやcssを利用した文字サイズを変える方法を、ソースを取り込んでみるのですががうまくできません。 初心者なので、かわかり易く教えていただると助かります。 尚、styleswitcher.jsはダウンロード済です。 ソースは、 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="style1.css" title="style1"> <link rel="alternate stylesheet" type="text/css" href="style2.css" title="style2"> <link rel="alternate stylesheet" type="text/css" href="style3.css" title="style3"> <script type="text/javascript" src="styleswitcher.js"></script> <style type="text/css"> style1.css body {font-size: 100%;} style2.css body {font-size: 80%;} style3.css body {font-size: 120%;} </style> <title></title> </head> <body> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style2'); return false;">サイズ小</a> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style1'); return false;">サイズ中</a> <a href="javascript:;" onclick="javascript:setActiveStyleSheet('style3'); return false;">サイズ大</a> <br> <br> テスト<br> </body> </html> よろしくお願いいたします。
- ベストアンサー
- HTML
- cssが反映されません。
記述はこうです。 <link href="../rendez.css" rel="stylesheet" type="text/css"> アップするとフォントのサイズ等がデフォルトのままです。 どなたかよろしくお願いします。
- ベストアンサー
- CSS
- CSSで、外部スタイルシートを2つ指定した場合。
たとえば、 <link href="style.css" rel="stylesheet" type="text/css"> <link href="info.css" rel="stylesheet" type="text/css"> のように２つスタイルシートを指定した場合、同じ内容のスタイルシートを書き込んだ場合どちらが優先されるのでしょうか。
- ベストアンサー
- HTML
- widthでcss,js切換可能でしょうか。
【Web製作】widthでcssやjavascriptを切換えたいです。 マルチデバイス対応のWebSiteを製作しようと思うのですが、 widthによって、cssやjavascriptを切り替えたいのですがどのようにすれば良いでしょうか。 横幅が【959px以下】の場合は【style-1.css】と【base1.js】 横幅が【960px以上】の場合は【style-2.css】と【base2.js】を適応させたいです。 htmlに <link href="style-1.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 959px)"> <link href="style-2.css" rel="stylesheet" type="text/css" media="only screen and (min-width: 960px)"> <link href="style-1.css" rel="stylesheet" type="text/css" media="only screen and (max-device-width: 959px)"> <link href="style-1.css" rel="stylesheet" type="text/css" media="only screen and (orientation: portrait) "> <link href="style-2.css" rel="stylesheet" type="text/css" media="only screen and (orientation: landscape) "> と記述してもうまく動作しません。(確認は【PC】【iPhone】【iPad】です。) 私の解釈ですと、 1.<link href="style-1.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 959px)"> ↑PCの場合、ウィンドウサイズが959px以下の場合【style-1.css】 2.<link href="style-2.css" rel="stylesheet" type="text/css" media="only screen and (min-width: 960px)"> ↑PCの場合、ウィンドウサイズが960px以上の場合【style-2.css】 3.<link href="style-1.css" rel="stylesheet" type="text/css" media="only screen and (max-device-width: 959px)"> ↑PC以外で、画面表示サイズが最大959px以下のデバイスの場合【style-1.css】 4.<link href="style-1.css" rel="stylesheet" type="text/css" media="only screen and (orientation: portrait) "> ↑PC以外で、画面表示サイズが最大959px以下ではないデバイスのポートレートモードの場合【style-1.css】 5.<link href="style-2.css" rel="stylesheet" type="text/css" media="only screen and (orientation: landscape) "> ↑PC以外で、画面表示サイズが最大959px以下ではないデバイスのランドスケープモードの場合【style-2.css】 と、解釈し指定しているのですがうまく動作しません。 そしてもう一つなのですが、 widthやポートレートモード、ランドスケープモードを判別しjsを切り替える事は可能でしょうか。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- CSS のときのヘッダの記述
<link rel="stylesheet" href="style.css" type="text/css" /> の link rel = の ●「 rel 」って何の省略なのでしょうか？ また、 ●href は Hyper link REFerence の略でしょうか？
- ベストアンサー
- HTML
- CSS、おかしいですか？
CSSですが、本を見てやっています。 下記のように記述したのですが、書かなくてもよい記述とか、おかしいところ、ありますでしょうか？ <style type=text/css> body{font-size:10pt} td {font-size:10pt; line-height:12pt} tr {font-size:10pt line-height:12pt} dive {font-size:10pt;line-height:12pt} a:link {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#990000} a:visited {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#990000} a:active {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#ff0099} a:hover {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#ff0099} </style>
- 締切済み
- CSS
- safari でcssがききません！
こんばんは。 仕事でサイトを作っているのですが、Macのsafariでだけまったくcssが効かないという現象にぶちあたってしまいました。 下のように、外部cssを読み込み、文字サイズはcss.jsでwin、mac向けに指定してます。（文字サイズは表示されてます） <link rel="stylesheet" type="text/css" href="css/default.css"/> <script language="javascript" type="text/javascript" src="js/css.js"></script> Macのfirefoxではなんの問題もありません。 cssは覚えたてて経験浅く、どのあたりに原因があるのかさっぱり分かりません…。 どなたか、解決法、参考サイトなどありましたら、教えてください！ よろしくお願いします。
- 締切済み
- HTML
補足
kokucho81さん、いつもありがとうございます。 本でMACとWINDOWSで、文字の大きさがMACのほうが小さいとふうに 書いてあったと思ったので、変えてみたのですが・・・ 「px指定」とはどのようなことでしょうか。