CSS含めてアップロードしても反映しない。

前へ 次へ
このQ&Aのポイント
  • デスクトップ上でwebサイトをTwitter bootstrapのフレームワークを使いながら構築しましたが、サーバーにアップロードした途端にCSSや画像の読み込みがされなくなりました。
  • Firefoxで「アクセス制限により一部のスタイルシートが読み込まれなかったため、ここでの結果は正確ではありません。」というメッセージが表示されます。
  • ディレクトリ構造は正しく設定されており、HTMLファイルのヘッダーでも適切な設定がされているため、原因が分からない状況です。
回答を見る
  • ベストアンサー

CSS含めてアップロードしても反映しない。

デスクトップ上でwebサイトをTwitter bootstrapのフレームワークを使いながら構築しました。ローカル上は何の問題もなかったのですが、サーバーにアップロードした途端に、CSSや画像の読み込みがされなくなってしまいました。 The results here may be inaccurate because some stylesheets could not be loaded due to access restrictions. というようなメッセージがfirefoxで確認されました。 ディレクトリ構造は、下記のような感じです。 index.html bootstrap/css bootstrap/js bootstrap/img 実際のindex.htmlのヘッダー (ちなみにhtml5の記法に従ってます。) <head> <meta charset="utf-8"/> <title>Twitter bootstrap practice</title> <link href="bootstrap/css/bootstrap.css" rel="stylesheet"/> <script src="bootstrap/js/jquery.js"/></script> <script src="bootstrap/js/bootstrap.min.js"/></script> <style type="text/css"> body{padding-top:40px} </style> </head> なぜかさっぱりわかりません。 教えてください。 よろしくおねがいします。

  • CSS
  • 回答数2
  • ありがとう数1

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

  • ベストアンサー
回答No.2

>due to access restrictions ファイルへのアクセス権があるか確認してみてください。

PtTakashi
質問者

お礼

アクセス権で解決しました！！ありがとうございます！！

その他の回答 (1)

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

firefoxをお使いなら、Live HTTP Headersをつかって、「The results here may be inaccurate because some stylesheets could not be loaded due to access restrictions.」は確認できます。 　Live HTTP Headers ( https://addons.mozilla.jp/firefox/details/3829 ) 　なお、HTMLは間違ってます。HTML5では、XHTMLとの過去互換性のため空要素は、/>で閉じることも許容されますが、 <script src="bootstrap/js/jquery.js"/></script> 　は明らかな間違いです。 <script src="bootstrap/js/jquery.js"> ですが、 <script src="bootstrap/js/jquery.js"/> とも書けます。type属性は不要になりました。

PtTakashi
質問者

補足

上のようにソースを修正しましたら、画面にhtmlも表示されなくなりました。 どうしてでしょうか？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. CSS

関連する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>

  • Twitter Bootstrap初期設定

    ドットインストールのソースをそのままコピーして 実行したところ、段組が崩れます。同じソースコードデモボタンから実行すると綺麗に動作している。 ＵＴＦ－８で保存もしています。 バージョンが違うためその他の設定が必要なのでしょうか？ ｊquery,cssなどがうまく動いてくれません。 1.<!DOCTYPE html> 2.<html lang="ja"> 3.<head> 4. <meta charset="utf-8"> 5. <title>Bootstrap 101 Template</title> 6. <link href="css/bootstrap.min.css" rel="stylesheet"> 7.</head> 8.<body> 9. 10.<div class="row"> 11. <div class="span4" style="background:red">Sidebar</div> 12. <div class="span8" style="background:green"> 13. Main 14. <div class="row"> 15. <div class="span4">aaa</div> 16. <div class="span4">bbb</div> 17. </div> 18. </div> 19.</div> 20. 21.<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> 22.<script src="js/bootstrap.min.js"></script> 23.</body> 24.</html>

    • ベストアンサー
    • CSS
  • HTMLをWordPress化 CSSをどこに？

    HTMLをWordPress化にするための勉強をしています。 HTML側 CSS ヘッダー内 <link rel="stylesheet" href="css/test.css"> <link rel="stylesheet" href="css/test2.css"> JS ヘッダー内ではなく一番下</body>の前に配置 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <script src="js/test1.js"></script> <script src="js/test2.js"></script> ★これをfunctions.php に記述するにはどうすれば良いのでしょうか？ function sample_scripts() {   // CSSの読み込み   wp_enqueue_style( 'jdsa-style', get_template_directory_uri().'/css/test.css', array(), '1' );   wp_enqueue_style( 'jdsa-style', get_template_directory_uri().'/css/test2.css', array(), '1' );   // jqueryの読み込み wp_deregister_script( 'jquery' ); wp_enqueue_script( 'jquery', get_template_directory_uri().'https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js', array(), '1.10.3', true );   // サイト内のjsの読み込み   wp_enqueue_script( 'jdsa-script', get_template_directory_uri().'/js/test1.js', array(), '1', true );   wp_enqueue_script( 'jdsa-script', get_template_directory_uri().'/js/test2.js', array(), '1', true ); }//ここまで 結果 ヘッダー内にtest.cssのみ記載、test2.cssは記載していない。 jsはどこにも記載していませんでした。 どこが間違っておりますか？ 宜しくお願いします。

    • ベストアンサー
    • PHP
  • jsがアップロードしても反映されない。エラーが出る

    デスクトップ上でwebサイトをTwitter bootstrapのフレームワークを使いながら構築しました。ローカル上は何の問題もなかったのですが、サーバーにアップロードした途端に、jsが全く動きません。 アクセス権は大丈夫です。 以下のエラーがサーバーにアップした途端にでるようになりました。 bootstrap.min.js:1　Uncaught TypeError: undefined is not a function index.html:175　　 Uncaught TypeError: Object [object Object] has no method 'tooltip' デスクトップでは問題なくbootstrapのjsが動作しましたが、サーバーに上げるとダメです。 なぜだかさっぱりわかりません。 助けてください

    • 締切済み
    • CSS
  • ファイヤーフォックスでCSSが読み込まれません

    会社のホームページを担当していて困っています。 ＩＥでは、きちんと表示されるのですが ファイヤーフォックスですと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>

  • 99limeの使い方がわかりません。助けてください

    私は、Webサイトを作るとき、デザインが苦手で、 bootstrapのCSSフレームワークを使っておりました。 いろいろな物を使ってデザインを試してみたいと思い、 99limeなどをダウンロードしたのですが、使えないのです。汗 全くわからず、ここ三日程、調べているのですが、うまくいかなくてお手上げ状態なのです。 例えば、99limeなどのサイトではもちろんのこと、Web内を調べてもこのような初歩的なことに対して、記述してある記事がなかったので、質問させてください どうすれば、99limeをhtmlに記述してWeb上で使用することができるのか 教えていただけませんか？ 以下現在の私の理解度具合です。 bootstrapの場合ですと、html内において、<head>では <link href="css/bootstrap.min.css" rel="stylesheet"> そして、<body>の最後、すなわち</body>の付近に <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> <script src="js/bootstrap.min.js"></script> と記述することで、bootstrapを使用することができました。 この方法はドットインストールという初学者のために公開された動画で解説されたものを そのまま使ったので、bootstrapを使うことができました。 動画添付でも、画像添付でも本当に困っておりまして、どなたか教えてください。 よろしくお願いします。 　　　　　　　　　　　　　　　　　　　　　　　　

    • 締切済み
    • CSS
  • 外部ファイルJS参照を全て消さないと「文字が正しくありません」エラー

    実に不思議なのですが、 以下のように4つのJSファイルをインクルードしているHTMLファイルを ローカルで開くと「文字が正しくありません」とスクリプトエラーが何回かでます。 ですが、script1～4.js　の行を全てコメントアウトすると、エラーはでません。 1～4のどれかにエラーが含まれているのかと、一つ一つを外してみましたが、 どの行を外しても、やはり「文字が正しくありません」と出てしまいます。 ローカルの然るべきパスに1～4はあります。また、HTML同様、JSもEUCになってます。 何が原因なのでしょうか？ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <title>タイトル</title> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> <meta http-equiv="content-script-type" content="text/javascript"> <meta http-equiv="content-style-type" content="text/css"> <link href="../css/style.css" rel="stylesheet"> <script src="../js/script1.js" type="text/javascript"></script> <script src="../js/script2.js" type="text/javascript"></script> <script src="../js/script3.js" type="text/javascript"></script> <script src="../js/script4.js" type="text/javascript"></script> </head>

  • 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
  • <SCRIPT src="css.js">の記述位置

    </head>と<body>の間に <SCRIPT LANGUAGE="javascript"src="css.js"></SCRIPT> を書くのは文法的に問題ありませんか？

  • ファイヤーフォックスでCSSが機能しません

    会社のホームページを担当していて困っています。 ＩＥでは、きちんと表示されるのですが ファイヤーフォックスですと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>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する