HPの文字の大きさを変えるCSSがうまくいかない問題について

このQ&Aのポイント
  • HTMLのフォントサイズを変えるCSSがうまく適用されない問題について解決方法を教えてください。
  • 初心者でもわかりやすい、HPの文字サイズを変更する方法を教えてください。
  • ソースコードのstyleswitcher.jsを利用して、HPの文字の大きさを変える方法がうまくいかない問題について何か解決策はありますか?
回答を見る
  • ベストアンサー

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
  • 回答数5
  • ありがとう数3

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.5

もう一度だけ、最初から 1) HTMLをテキストエディタにコピーペーストして、適当なフォルダにtest.htmlで保存する。 2) 三種類のスタイルシートを  [mediam.css] @charset "Shift_JIS"; body{font-size:2em;}  [small.css] @charset "Shift_JIS"; body{font-size:0.8em;}  [big.css] @charset "Shift_JIS"; body{font-size:2em;} を同じ場所に作ったstyleSheetフォルダーに入れる。 3) ブラウザで表示させて、表示メニューからスタイルを選択してjavascriptを使用しなくても変更されることを確認 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> _<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> _<title>サンプル</title> _<meta http-equiv="Content-Script-Type" content="text/javascript"> _<meta http-equiv="Content-Style-Type" content="text/css"> _<link rel="stylesheet" href="./styleSheet/mediam.css" type="text/css" id="mystyle"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/small.css" title="小さな文字"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/big.css" title="大きな文字"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/mediam.css" title="標準サイズ"> _<link rel="START" href="../index.html"> <script type="text/javascript"> <!-- _function styleCange(cssfile) {document.getElementById('mystyle').href = cssfile;} // --> </script> <style type="text/css"> <!-- html,body{margin:0;padding:0;} p{text-indent:1em;} ul.changeStyle,ul.changeStyle li{list-style:none;margin:0;padding:0;text-align:center;} ul.changeStyle li{width:6em;display:inline-block;} --> </style> </head> <body> _<div class="header"> __<h1>タイトル</h1> __<ul class="changeStyle"> ___<li><a href="javascript;" onclick="javascript:styleCange('./styleSheet/small.css'); return false;">サイズ小</a></li> ___<li><a href="javascript;" onclick="javascript:styleCange('./styleSheet/big.css'); return false;">サイズ大</a></li> ___<li><a href="javascript;" onclick="javascript:styleCange('./styleSheet/mediam'); return false;">標準サイズ</a></li> __</ul> _</div> _<div class="section"> __<h2>見出し</h2> __<p>・・・</p> _</div> _<div class="footer"> __<h2>文書情報</h2> __<dl class="documentHistry"> ___<dt id="FIRST-PUBLISHED">First Published</dt> ___<dd>2012-08-10</dd> __</dl> __<address>&copy; ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address> _</div> </body> </html>

jeday8118
質問者

お礼

ORUKA1951さん。文字サイズがかわりました!!!! 大きさが変わったときは感動しました。 ORUKA1951さんが言うとおり、CSSの書き方やHPの作り方がわからないのに、見よう見まねで行ったのがいけなかったと思います。 このソースを素に構造を理解していこうと思います。 本当に本当にありがとうございました。 感謝いたします。

その他の回答 (4)

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.4

No.2への補足への説明です。  まず、No.1で示した回答サンプルを理解しなさい!!!!。  それが出来ないならそのままコピーペーストして使うべきです。その説明まで要望しても、それはあなたの身には付きません。勉強と一緒、公式や答えを知ってもテストには役立たないでしょ。  クリックすると、./styleSheet/big.cssの値などをstyleChange()に渡していますね。styleChangでは、受け取った値をcssfileの値として、mystyleというIDを持つ要素(Element)を見つけて、その要素のhref属性の値をcssfileに代入しています。 <link rel="stylesheet" href="./styleSheet/mediam.css" type="text/css" id="mystyle"> ↓ <link rel="stylesheet" href="./styleSheet/big.css" type="text/css" id="mystyle"> に変更されます。標準スタイルシートへのパスが変わる。  よって、決して、No.2の補足で示されたようなものにはならないはずです。 もともとは、下記のような単純なHTMLです。 この状態で、スタイルが表示メニューから変更できることを確認してください。 そして、No.1の例と見比べて、No.1で示したサンプルを追加する。 物事には順番があります。その順番に従うのが一番の早道です。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> _<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> _<title>サンプル</title> _<meta http-equiv="Content-Script-Type" content="text/javascript"> _<meta http-equiv="Content-Style-Type" content="text/css"> _<link rel="stylesheet" href="./styleSheet/mediam.css" type="text/css"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/small.css" title="小さな文字"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/big.css" title="大きな文字"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/mediam.css" title="標準サイズ"> _<link rel="START" href="../index.html"> <style type="text/css"> <!-- ul.changeStyle,ul.changeStyle li{list-style:none;margin:0;padding:0;text-align:center;} ul.changeStyle li{width:6em;display:inline-block;} --> </style> </head> <body> _<div class="header"> __<h1>タイトル</h1> _</div> _<div class="section"> __<h2>見出し</h2> __<p>・・・</p> _</div> _<div class="footer"> __<h2>文書情報</h2> __<dl class="documentHistry"> ___<dt id="FIRST-PUBLISHED">First Published</dt> ___<dd>2012-08-10</dd> __</dl> __<address>&copy; ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address> _</div> </body> </html>  

jeday8118
質問者

お礼

お礼が遅くなり、スミマセンでした。 教えていただいたソースを貼り付けて行ってみるのですがやはり駄目でした。 教えて頂いたソースを素にCSSやjsについて勉強してみようと思います。ありがとうございました。

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.3

>やはり、文字の大きさは変わりません。ご教授いただけないでしょうか? javasciptの前に、ブラウザの表示メニューから代替スタイルシートを選択した場合に変わりますか?  それが変わらないと、javascriptでも変えられません。単に標準スタイルシートを書き換えているだけですから。。 small.css,big.css,miediam.cssは用意されましたか?

jeday8118
質問者

お礼

お礼が遅くなり、スミマセンでした。 教えていただいたソースを貼り付けて行ってみるのですがやはり駄目でした。 教えて頂いたソースを素にCSSやjsについて勉強してみようと思います。 ありがとうございました。

回答No.2

<!-- 原理主義の爺さんは今日も相変わらずだな(笑) --> <style type="text/css"> style1.css body {font-size: 100%;} style2.css body {font-size: 80%;} style3.css body {font-size: 120%;} </style> これがおかしいです。 なんでこうなったか分からないけど、紹介サイトのコピペでもしたんかな? おそらく 「style1.css」というファイルに「body {font-size: 100%;}」と書く 「style2.css」というファイルに「body {font-size: 80%;}」と書く 「style3.css」というファイルに「body {font-size: 120%;}」と書く という説明をしている記述をだったのでしょうね。 それを踏まえて紹介サイトを見直し、やり直して見てください。 ※コピペで「動けばいい」という考え方そのものは否定しませんが、 それにしたって最低限レベルの知識はつけないと今回みたいな妙な失敗をします。 CSSはどこにどう書いてどう適用されるのか。それくらいはしっかり勉強しましょう。

jeday8118
質問者

補足

初心者なのでスミマセン!お手数かけます。 以下のようにソースを変えてみたのですがやっぱり駄目で、どこに問題があるのかわかりません。やはり無理なのでしょうか? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>デフォルト:小のサンプル フォントサイズ変更(大・中・小)</title> <script type="text/javascript" src="styleswitcher.js"></script> <link href="css/14.css" rel="stylesheet" type="text/css" title="Default" media="medium" /> <link href="css/11.css" rel="alternate stylesheet" type="text/css" title="Mid Font" media="small" /> <link href="css/16.css" rel="alternate stylesheet" type="text/css" title="Large Font" media="large" /> </head> <body> <ul> <li>フォントサイズ:</li> <li class="small"><a href="#" onclick="setActiveStyleSheet('Default'); return false;">小</a></li> <li class="medium"><a href="#" onclick="setActiveStyleSheet('Mid Font'); return false;">中</a></li> <li class="large"><a href="#" onclick="setActiveStyleSheet('Large Font'); return false;">大</a></li> </ul> <p>test</p> </body>

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

 そんなところにはまるより、HTMLやスタイルシートの基礎を押さえるほうが先のような気がします。javascriptで関数を呼び出しても相手がいないし・・ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> じゃなくて、 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> のstrictで作成しましょう。どちらも標準モードで起動しますが、さすが「HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html#h-4.1 )」以来12年経つので、いくらなんでも。 ★<br>は原則使いません。 ★a要素は行内要素ですから<body>下には書けません。 ★javascriptが利用できないユーザーのためにalternate stylesheetも書いておきましょう。(書いてありますね。) ★javascript自体は数行ですみます。 ※./styleSheet内に三種類のスタイルシートを用意しておく。 ※タブは_に置換してある。 ※こんなことより、HTMLやCSSの基礎をきちんと学びましょう。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> _<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> _<title>サンプル</title> _<meta http-equiv="Content-Script-Type" content="text/javascript"> _<meta http-equiv="Content-Style-Type" content="text/css"> _<link rel="stylesheet" href="./styleSheet/mediam.css" type="text/css" id="mystyle"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/small.css" title="小さな文字"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/big.css" title="大きな文字"> _<link rel="Alternate StyleSheet" type="text/css" media="screen" href="./styleSheet/mediam.css" title="標準サイズ"> _<link rel="START" href="../index.html"> <script type="text/javascript"> <!-- _function styleCange(cssfile) {document.getElementById('mystyle').href = cssfile;} // --> </script> <style type="text/css"> <!-- ul.changeStyle,ul.changeStyle li{list-style:none;margin:0;padding:0;text-align:center;} ul.changeStyle li{width:6em;display:inline-block;} --> </style> </head> <body> _<div class="header"> __<h1>タイトル</h1> __<ul class="changeStyle"> ___<li><a href="javascript;" onclick="javascript:styleCange('./styleSheet/small.css'); return false;">サイズ小</a></li> ___<li><a href="javascript;" onclick="javascript:styleCange('./styleSheet/big.css'); return false;">サイズ大</a></li> ___<li><a href="javascript;" onclick="javascript:styleCange('./styleSheet/mediam'); return false;">標準サイズ</a></li> __</ul> _</div> _<div class="section"> __<h2>見出し</h2> __<p>・・・</p> _</div> _<div class="footer"> __<h2>文書情報</h2> __<dl class="documentHistry"> ___<dt id="FIRST-PUBLISHED">First Published</dt> ___<dd>2012-08-10</dd> __</dl> __<address>&copy; ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address> _</div> </body> </html>

jeday8118
質問者

補足

ありがとうございました。確かに知識がないのに行うのは無理かもしれません・・・・。掲載してあったソースを貼り付けて(_は消去して)動かしてみたのですがやはり、文字の大きさは変わりません。ご教授いただけないでしょうか? よろしくお願いいたします。

関連するQ&A

  • HTMLメールの外部CSSが有効になりません

    HTMLメールから以下のように外部CSS(http://から始めてます)を利用したいのですが、実際にOUTLOOK 2003 SP3で見るとスタイルが適用されていません。 ローカルで同じHTMLをブラウザで開くとスタイルは適用されます。HTMLメールのときは何か特別なことが必要なのでしょうか? <link href="http://domain/style.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="http://domain/style2.css" type="text/css" media="screen" /> <script language="JavaScript1.2" src="http://domain/js.js" type="text/javascript"></script> ヘッダ全体を以下に掲載しておきます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head> <title>TITLE</title> <link href="http://domain/style.css" rel="stylesheet" type="text/css"> <script language="JavaScript1.2" src="http://domain/js.js" type="text/javascript"></script> <link rel="stylesheet" href="http://domain/style2.css" type="text/css" media="screen" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head>

  • 印刷曜CSSがどこかおかしい・・・非常に困っています。。。

    <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title></title> <link rel="stylesheet" type="text/css" media="print" href="print.css"> <style type="text/css"> <!-- .style1 { font-family: "MS Pゴシック"; font-size: 12px;} --> <style type="text/css" media="print"> .print { display: "none" } </style> </style> </head> <body> <span class="style1"><p class="print"><p class="print2"><a onclick="window.print();return false;" href="#" >おおお</a></p></p></span> とソースに記載すると、「おおお」が印刷されないと思うのですが、なぜか、「おおお」が印刷されてしまいます。 どうすれば、「おおお」を印刷されなくなるのでしょうか?

    • ベストアンサー
    • HTML
  • 文字サイズの大中小について

    お世話になります。 今、ホームページを作成しているのですが… ホームページ上で、文字のサイズを簡単に切り替えられる様にしようと思い、探してみたところ、styleswitcher.jsというJavascriptがあったので貰ってきました。 http://alistapart.com/stories/alternate/ ここからstyleswitcher.jsをいただいてきました。 文字の大きさが大、中、小になるように.cssファイルを3つ作り、拡張子.cssはcssフォルダに、拡張子.jsはjsフォルダに分けていれています。 <head> <script type="text/javascript" src="js/styleswitcher.js"></script> <link href="css/main_small.css" rel="stylesheet" type="text/css" title="small" /> <link href="css/main_normal.css" rel="stylesheet" type="text/css" title="normal" /> <link href="css/main_large.css" rel="stylesheet" type="text/css" title="large" /> </head> という風に、ヘッダーのところにリンクを貼りました。 IE、Firefox、Opera、safari(windows用)では、動作確認が出来たのですが、NN7だけが動きませんでした。 設定を確認したところ、Javascriptを有効にするにはチェックがついていました。 設定のところでOKを押してから、切り替えボタンを押すと文字サイズが切り替えられるのですが、違うページに移動してしまうとその機能は動きません。 正直、Javascriptについての知識は全くなく、何がおかしいのか検討も付きません。 googleで何か情報がないか探してみたのですが、Firefoxに問題がある文章はいくつか見かけたのですが、NNに関する情報は見つけられませんでした。 各ブラウザにもいろいろ特徴があるから、動かなくても仕方ないのかな? でも、NNユーザーの為にも何とかしたいなぁと思いますし、一体どうしたら良いのか困ってます。 大変申し訳ないのですが、どなたかアドバイスをいただけませんでしょうか?よろしくお願いします。

  • 外部ファイルを読み込んだhtmlをinclude

    外部ファイルを読み込んだhtmlをincludeしたいです。 ディレクトリの階層は、 index.php style.css /pic/picture.html /pic/css/style1.css /pic/css/style2.css : /pic/css/style13.css /pic/js/jquery1.js /pic/js/jquery2.js : /pic/js/jquery15.js : (画像などが他にもいっぱい) となっています。 ----- picture.html内には <link rel="stylesheet" type="text/css" href="css/style1.css"> <link rel="stylesheet" type="text/css" href="css/style2.css"> : <link rel="stylesheet" type="text/css" href="css/style13.css"> <link rel="stylesheet" type="text/css" href="js/jquery1.js"> <link rel="stylesheet" type="text/css" href="js/jquery2.js"> : <link rel="stylesheet" type="text/css" href="js/jquery15.js"> : と書かれています。 ---- このときindex.phpのbody内に <?php include('./picture.html'); ?> とした場合、相対パスによる記述なのでpicture.html以外のcssやjsは適用されませんよね。 しかし/pic/内にあるすべてのpicture.htmlに関係するファイルは非常に数が多いので、これらすべてをincludeするのは厳しいです。 すべての外部ファイルを読み込んだ状態のpicture.htmlをbody内に表示したいのですが、そんなことは可能でしょうか。 どなたかご教示ください。どうかよろしくお願いします。

    • ベストアンサー
    • PHP
  • 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を切り替える事は可能でしょうか。 よろしくお願いいたします。

  • ModalBoxのIEでの表示について

    質問です。 javascriptの「ModalBox」についてなのですがModalBox内で指定したhtmlファイルがIE7では表示されません。Firefoxでは表示されるのですが・・・なぜでしょう? 一応javascriptは表示され上からウィンドウは表示されるのですが中身の内容がでてきません(Firefoxなら表示されます) ソースですが 表示するボタンがある側↓----------------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>ModalBox サンプル</title> <meta http-equiv="Content-Style-Type" content="text/css" /> <link rel="stylesheet" href="modalbox.css" type="text/css" media="all"> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="lib/prototype.js"></script> <script type="text/javascript" src="lib/scriptaculous.js"></script> <script type="text/javascript" src="modalbox.js"></script> </head> <body> <h1>ModalBoxサンプル</h1> <a href="sample.html" title="Sample 1" onclick="Modalbox.show(this.href, this.title); return false;">ダイアログを表示</a> </body> </html> --------------------------- 表示されるhtml側↓ <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Sample</title> </head> <body> サンプル </body> </html> ----------------------------- となっています。 調べたところIE7にも対応しているとの事なのですが何故でしょうか?

  • javascriptにてcss切り替え

    現在webサイトを作成しており、javascriptのcss切り替えにてページの色変更を作っています。 (青、緑、赤、三色で作成) デフォは青で表示しています。 その後緑、赤とリンクで色が変わるようにしています。 ここでご質問です。 緑をクリックした場合は緑に変わる(赤も同様)のですが、別ページにリンクした場合、緑(赤)ではなく青に戻ってします。 別ページにとんでも緑(赤)が引き継がれるにはどのように記述したらよろしいでしょうか? ソースは以下のとおりです。 <head> <link rel="stylesheet" type="text/css" href="css/blue/top.css" media="all" /> <script src="js/styleswitch.js" type="text/javascript"></script> <link rel="alternate stylesheet" type="text/css" title="blue" href="css/blue/top.css" media="all" /> <link rel="alternate stylesheet" type="text/css" title="green" href="css/green/top.css" media="all" /> <link rel="alternate stylesheet" type="text/css" title="red" href="css/red/top.css" media="all" /> </head> <body> <div style="width:200px;"> <a href="javascript:chooseStyle('blue', 30)">青</a><br /> <a href="javascript:chooseStyle('green', 30)">緑</a><br /> <a href="javascript:chooseStyle('red', 30)">赤</a> </div> </body> javascriptは以下のところからしようしています。 http://noongoro.main.jp/note/note0059.html javascriptは初心者です。 ご教授お願いいたします。

  • CSSが適応されない

    ジオシティーズなどのHPにスタイルシートを適応させたいのですが、適応されず困ってます。 <meta http-equiv="content-style-type" content="text/css"> <link href="stylesheet.css" rel="stylesheet" type="text/css"> としてHPに記述してstylesheet.cssという外部ファイルを読み込ませたいのですが適応されません。 どうすればいいのでしょうか? ご回答宜しく御願い致します。

  • CSSのMETA http-equiv・・・・

    <link rel="stylesheet" href="style.css" type="text/css"> と ところどころ<span>でCSSを利用していますが、 <META http-equiv="Content-Style-Type" content="text/css"> を書いたほうがいいのでしょうか。 もし、<span>を使用しなければ書かなくても良いものなのでしょうか。

    • ベストアンサー
    • HTML
  • ファイヤーフォックスでCSSが読み込まれません

    会社のホームページを担当していて困っています。 IEでは、きちんと表示されるのですが ファイヤーフォックスですとCSSを認識してくれないようです。 下記が自分会社のソースです。 何が悪いのでしょうか? よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html lang="ja"> <head> <title></title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/JavaScript"> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <SCRIPT language=javascript src="js/libs.js" type=text/javascript></SCRIPT> <meta name="ROBOTS" content="ALL"> <<link href="css/stylesheet.css" rel="stylesheet" type="text/css" media="all"> </head>