IE以外のブラウザでも表示できる方法は？
- 文字をウィンドウ底面に合わせて動くレイアウトにした所、Netscape・FireFox・Operaでは文字が消えて見れませんでした。
- IE以外のブラウザでも見れるようにするにはどうしたらよいのでしょうか？
- タグは以下のようになっていますがどこか間違っていたらご指摘お願い致します。
- ベストアンサー
IE以外のブラウザでも表示したい
文字をウィンドウ底面に合わせて動くレイアウトにした所、 Netscape・FireFox・Operaでは文字が消えて見れませんでした。IEでは普通に希望レイアウト通り見れています。 IE以外のブラウザ（最低限上記）でも見れるようにするにはどうしたらよいのでしょうか？ タグは以下のようになっていますがどこか間違っていたらご指摘お願い致します。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>menu</title> <style type="text/css"> <!-- BODY{ scrollbar-3dlight-color:#ffffff; scrollbar-arrow-color:black; scrollbar-darkshadow-color:#ffffff; scrollbar-face-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#ffffff; scrollbar-track-color:#ffffff; background-color : black; background-image : url(logo.gif); background-repeat : no-repeat; background-attachment : fixed; position : fixed; } P{ font-family : Arial; font-weight : bold; color:#dcdcdc; position:absolute; bottom:0px; margin-left : 30px; } FONT{ font-size : 8pt; font-family :"ＭＳ ゴシック"; font-weight : normal; } --> </STYLE> </head> <body> <p align="center"> <a href="**.html" target="**">1</a><br> <br> <a href="**.html" target="**">2</a><br> <br> </p> </body> </html>
- nijiko1104
- お礼率87% (273/312)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
BODYの、position : fixed; をカットしたらどうなるだろうか。
関連するQ&A
- ＩＥバーションアップによる反映について～有効なタグ
ＨＰを手打ちで作っています。 自分は、プラウザＩE８の前のバージョンのままで、 アップするかずっと迷っています。理由は、 ・レイアウトが崩れる可能性がある ・しかも、ほかのプラウザでは、同じように反映されない （例：ファイヤーフォックス） 主に、 画像を一枚背景にして定置し、 その上にスタイルシートで文字列を上書きし、 画像の配置と文字列の配置を、自由に（左上２０％の位置・右寄せ・中央寄せなど）決めたいのです。 自分のプラウザでは、一枚の画像で反映されているのですが、 ＦＦでは、画像が繰り返しされ、全面に反映されてしまったり、 画像一枚さえ反映されなかったりしています。 以下のようなタグは、古いのでしょうか。 <Style Type="text/css"> <!-- /*style*/ body {background-color:#ffffff; background-image:url(xxxx.jpg); background-repeat:no-repeat; background-attachment:fixed; background-position:50% 50%; scrollbar-face-color:#ffa500; scrollbar-track-color:#ffffeo; scrollbar-arrow-color:#ff8c00; scrollbar-highlight-color:#ffffe0; scrollbar-darkshadow-color:#ff8c00; font-family:Tempus sans ITC;} A{text-decoration:none;} --> </Style> ・・・・・・・・・・ 回答していただきたい点は、 ・バージョンアップしても、対応でき有効なタグ選びにはどんな点に留意すべきか ・なおかつ、ＩＥ以外のプラウザでも、同じように反映して見てもらえるのかどうか ・一枚の画像配置の自由化、その上のテキスト列の配置の自由化 これが、簡易に指定できる、互換性ある有効なタグは、どういったものなのか 勉強不足なのは承知しております。 文字列ですが、主に、 div table で指定しています。 一面の例は以下です。 （こちらは、希望通り反映されています） ・・・・・・・・・・・・・・・・・・・・・・・ <!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML4.01//EN"> <html> <head> <title>yyyyyyyy</title> <STYLE TYPE="text/css"> <!-- /*STYLE*/ body{ scrollbar-base-color:#ffffff; scrollbar-face-color:#ffffff; scrollbar-arrow-color:#ffffff; scrollbar-darkshadow-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#ffffff; scrollbar-track-color:#ffffff; line-height:140%; font-family:"MS UI Gothic" , sans-serif; font-size:11pt; background-color:#000011; background-image:url(xxxx.jpg); background-position:20% 20%; background-repeat:no-repeat; background-attachment:fixed; } A{text-decoration:none } html{ scrollbar-base-color:#ffffff; scrollbar-face-color:#e0eeee; } --> </STYLE> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"> <META http-equiv="Content-style-Type"content="text/css"> <META HTTP-EQUIV="Content-Type"CONTENT="text/html;charset=euc-jp"> </head> <body> <body text="#BC8F8F"> <table width="60%"align="right"bgcolor="#BC8F8F"> <div align="right"bgcolor="#BC8F8F"> <br><br><br><br><br><br><br> テキスト部分 <br><br><br><br><br><br> </div> </table> </body> </html> ・・・・・・・・・・・・・・・・・・・・・・・ また、こちらは画像が繰り返されてしまっています。 ・・・・・・・・・ <Style Type="text/css"> <!-- /*style*/ body {background-color:#ffffff; background-image:url(xxx.jpg); background-repeat:no-repeat; background-attachment:fixed; background-position:50% 50%; font-family:Tempus sans ITC;} A{text-decoration:none;} --> </Style> </HEAD> <BODY onContextmenu="return false"> <body bgcolor="#000022" text="#6495ed"Link="#6495ed"ALink="#4169e1"VLink="#1e90ff"basefontsize="4"style="scrollbar-3d-light-color:silver; scrollbar-arrow-color:#c2f500; scrollbar-base-color:#c2f500; scrollbar-dark-shadow-color:#c2f500; scrollbar-face-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#c2f500"> <table width="900"height="700"border="0"cellpadding="0"cellspacing="0"> <tr align="center" valign="top"> <td align="left" valign=middle"> <div align="left"valign="top"> <br><br><br><br> ～文字テキスト部分～ <br> </td></tr> </table> </body> </html> ・・・・・・・・・・・・・ 不備・間違い・改良点など、ご指摘していただければ幸いです。 これから参考に読む予定のサイト http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html#minitoc よろしくお願いいたします。
- 締切済み
- CSS
- スタイルシートのリンクについて
スタイルシートを下記の様に記述しました。 そこでリンクの部分なのですが ポインタが上にのった時にff6666になるようにしているのですが、 ff9900のままなのです。 通常はffcc00 既読はff9900 ポインタ上にのった時にff6666 クリックした時にff0000としたいのです。 どなたかお教え下さい。 <style type="text/css"> <!-- BODY { SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #ffcc00; SCROLLBAR-ARROW-COLOR: #ffcc00; SCROLLBAR-BASE-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR : #ffffff; SCROLLBAR-3DLIGHT-COLOR : #ffcc00} body,tr,td {font-size: 9pt;} body,tr,td {color: #ffcc00;} a {text-decoration: none;} a:link {color: #ffcc00;} a:hover {text-decoration: underline;} a:hover {color: #ff6666;} a:active {color: #ff0000;} a:visited {color: #ff9900;} body { background-repeat: no-repeat; background-position: 100% 100%; background-attachment: fixed;} --> </style>
- ベストアンサー
- CSS
- 文字化けすると言われましたが
自宅PC（XP）、会社PC（98）では 問題なかったのですが、XPでIE６を使用の方に 文字化けすると言われました 以下ソースです 「恋をして…」が文字化けし エンコードすれば読めるらしいのですが…。 ひょっとして、末にある <BASEFONT SIZE="2"Font Color="black"> が問題なのでしょうか？ <HTML> <HEAD> <TITLE>玄関</TITLE> <meta http-equiv="refresh" content="8; url=top.html"> </HEAD> <STYLE> BODY{ scrollbar-3dlight-color:#ffffff; scrollbar-arrow-color:#ffffff; scrollbar-darkshadow-color:#ffffff; scrollbar-face-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#ffffff; scrollbar-track-color:#ffffff;} </STYLE> <BODY bgcolor="white" text="#000000" link="#000000" vlink="#000000" alink="#000000" style="background-repeat : no-repeat;background-attachment : fixed;background-image : url;; background-position : right bottom;"> <DIV ALIGN="center"><TABLE border="0"> <BR><BR><BR><BR><BR><BR><BR><TR> <TD><BR><BR><BR>恋をして私は</TD> </TR> <TR> <TD><DIV ALIGN="rignt"><Img Src="image/back/031231.bmp" Alt="" border="0"></DIV></TD> </TR> <TR> <TD><DIV ALIGN="left"><B></B><BR><BR> 馬鹿になった。</DIV></TD> </TR> </TABLE></DIV> <BASEFONT SIZE="2"Font Color="black"><p align="left"> <BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR> <BR></Font> </P> </BODY> </HTML>
- ベストアンサー
- HTML
- スクロールバーの色変更（長文）
スクロールバーの色を設定したいのですが、下のように書くとうまく設定できません。 どこがおかしいのでしょうか？ よろしくおねがいいたします。 <html> <head> <style type="text/css"> <!-- body { scrollbar-3dlight-color:#808080; scrollbar-arrow-color:#ffffff; scrollbar-base-color:#ffffff; scrollbar-darkshadow-color:#ffffff; scrollbar-face-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#ffffff;} body { background-image:url("top/newtop.jpg"); background-repeat:no-repeat; background-attachment:fixed; background-position:50% 20%; background-color:#ffffff; } div { text-arign:center; padding:10px; border-width:thin; border-style:dotted; background-color:transparent; } #kousinrireki{ position:static; margin-top:20px; margin-right:80%; margin-bottom:70%; margin-left:0%; } #reserve { text-arign:center; padding:0px; border-width:thin; border-style:none; background-color:transparent; color:maroon; ｝ --> </style> </head> <BODY TEXT="#708090"> <font size=-2> <body> <div id="kousinrireki"> ※リニューアル♪<BR> </div> <div id="reserve"> Fumio All rights reserved<BR> </div> </body> </html>
- ベストアンサー
- HTML
- スクロールバーの色の変更について
パソコンによってスクロールバーの色の変更ができるのとできないのとがあるのはソースの問題でしょうか？ ちなみにソースは以下のとおりです。 <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>××</title> <STYLE type="text/css"> <!--BODY{ scrollbar-face-color:#FFCECE; scrollbar-highlight-color: #ffffff; scrollbar-shadow-color: #ffffff; scrollbar-3dlight-color: #ffffff; scrollbar-arrow-color: #ffffff; scrollbar-track-color: #ffffff; scrollbar-darkshadow-color: #ffffff; font-family: "ＭＳ ゴシック", "Osaka－等幅"; color: #660033; background-image: url(IMAGES/××.gif); }--> </STYLE> </head>
- ベストアンサー
- HTML
- どこがおかしいのでしょうか
<HEAD> <script language=JavaScript> <!-- if(top==self){ location.href="http://www.yahoo.co.jp"} // --> </script> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE>猫</TITLE> <STYLE type="text/css"> <!-- body{ scrollbar-base-color:#FFFFFF; scrollbar-arrow-color:#FFFFFF; scrollbar-darkshadow-color:#FFFFFF; scrollbar-face-color:#FFFFFF; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FFFFFF; } --> </STYLE> </HEAD> スクロールバーノ色が変わりません。 何がおかしいのでしょうか。
- ベストアンサー
- CSS
- スクロールバーが反映されない
ＨＰ作成まったくの初心者です。 今つまづいているのが、スクロールバーの色が 変更できないことです。 ＩＥは「Internet Explorer 6 Service Pack 1 (Windows XP SP1) 」です。 いちおう、タグを載せます。 初心者なのでめちゃめちゃだと思いますので お恥ずかしいのですが、よければご教授ください。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <META http-equiv="Content-Script-Type" content="text/javascript"> <META http-equiv="Content-Style-Type" content="text/css"> <title>☆</title> <script type="text/javascript"> <!-- function jikoku() { dd = new Date(); document.F1.T1.value = dd.toLocaleString(); window.setTimeout("jikoku()", 1000); } // --> </script> <STYLE type="text/css"> <!-- body,td { font-size : 12px; color : #bc8f8f; font-family : Verdana; line-height : 15pt; } --> </STYLE> <style type="text/css"> <!-- a{ text-decoration : none; } a:link{ color : #ffb9d4; } a:active { color : #69b4; } a:visited{ color : #ffd9e4; } a:hover{ color : #FFd9b4; position : relative; top : 2px;} --> </style> <STYLE type="text/css"> <!-- body { scrollbar-face-color:#ffffff; scrollbar-track-color: #ffffff; scrollbar-arrow-color:#ffb9d4; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#ffffff; scrollbar-3dlight-color:#ffffff; scrollbar-darkshadow-color:#ffffff; } --> </STYLE> </head> <body> <BODY background=img/wall.gif> </body> </html>
- ベストアンサー
- HTML
- metaの指定
こんにちは。くだらない質問で申し訳ありませんが、初心者なのでお助けください。 GeoCitiesでHPを作っています。 GeoCitiesではEUCになってしまうと聞いたので、<meta http-equiv="Content-Type" content="text/html; charset=euc-jp"> としていますが、A href="mailto: を使用してメールフォームを作ると、日本語が文字化けしてしまいます。ファイルの転送はNextFTP4を使用しているのですが、何が問題なのでしょうか？どなたかお助けください。宜しくお願いします。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp"> <META http-equiv="Content-Style-Type" content="text/css"> <title>MYHP</title> <BODY BACKGROUND="stripe.gif" oncontextmenu="return false"> <style type="text/css"> <!-- body { scrollbar-face-color: #ff9999; scrollbar-highlight-color: #ffffff; scrollbar-shadow-color: #ffffff; scrollbar-3dlight-color: #ff9999; scrollbar-darkshadow-color: #ff9999; scrollbar-track-color: #ffe5dd; scrollbar-arrow-color: #ffffff; } --> </style></head>
- 締切済み
- HTML
- FORMのサイズがIEとFirefoxで違って困っています！
依頼されて問合せフォームを作成しているのですが、 <input type="text">や<textarea>の部分がIEとFirefoxでサイズが違ってしまい、綺麗に表示されません。 IEで丁度いい大きさにsize指定すると、Firefoxでは大きすぎ、 Firefoxで丁度いい大きさにsize指定すると、IEでは小さすぎます。 初心者でよく分からず、大変困っております。 どなたかご教示頂きたく、よろしくお願い致します！！ 【(1)のCSS】 html { scrollbar-face-color: #F5E1D8; scrollbar-highlight-color: #FFFFFF; scrollbar-shadow-color:#F5E1D8; scrollbar-3dlight-color: #F5E1D8; scrollbar-arrow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; } body { margin:0 auto 0; background-color: #FFFFFF; font-family:sans-serif; font-size:8pt; } form { margin:0px; scrollbar-face-color: #F5E1D8; scrollbar-highlight-color: #FFFFFF; scrollbar-shadow-color:#F5E1D8; scrollbar-3dlight-color: #F5E1D8; scrollbar-arrow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; } input { font-size:12px; } #container { width:957px; margin:0 auto 0; background-color:#FFFFFF; } #logo{ margin-left:80px; height:120px; } #box1{ text-align:center; line-height:20px; height:100px; } #nyuryoku{ margin:0 auto 0; width:418px; height:600px; background-image: url(../img/sinki_waku.gif); background-repeat: no-repeat; background-position: center center } #box2{ clear:both; text-align:center; line-height:20px; width:957px; height:250px; background-image: url(../img/top_haikei.jpg); background-repeat: no-repeat; background-position: center bottom } #button{ margin:0 auto 0; width:418px; }
- 締切済み
- HTML
- スクロールバーの色を変更できません。
web上のサイトを参考にhtmlを組んでいるのですが下記のソースでスクロールバーの色を変更することができません。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> <style type="text/css"> <!-- html,body { scrollbar-face-color: #ffffff; scrollbar-highlight-color: #cccccc; scrollbar-shadow-color: #cccccc; scrollbar-3dlight-color: #ffffff; scrollbar-arrow-color: #999999; scrollbar-track-color: #ffffff; scrollbar-darkshadow-color: #ffffff; } --> </style> </head> <body> <iframe src="a.html" name="sample" width="200" height="150"> </iframe> </body> </html> **************a.html******************** <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> </head> <body> hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br />hello world<br /> </body> </html>
- 締切済み
- HTML
お礼
見れました！ありがとうございました！！ たったこれだけだったんですね お恥ずかしい限りです…
補足
すみません。下にお礼を投稿してしまいましたが、 OperaとNeでは大丈夫でしたがFireFoxでは表示されずでした。