TOPページ > ＨＴＭＬとＣＳＳを使ったホームページの作り方 > スタイルシートCSSの内容がhtmlに反映されない

スタイルシートCSSの内容がhtmlに反映されない

質問の内容 htmlとcssのファイルを添付しました。

エディターにそれぞれ入れたのですが、スタイルシートの中に教材のテキスト部分のCSS部分をコピペで貼り付けました。

しかし、index.htmlをブラウザーで見たところ反映されていません。

お答えした内容

マニュアルで言うと、14ページの下からの解説を正しく実行されていません。

送っていただいたファイルの名前と形式が両方間違っておられます。

いただいたファイルは「css.txt」になっていますね。これでは機能しません。ファイル名は自分でも決められるのですが、ファイル形式は.txtではなく、.cssにしないといけません。

正しくはstyle.cssです。マニュアルにも「style.cssをコピペしてください」と明記しております。

indexはhtmlという形式でしたし、styleはcssという形式になります。そしてstyleというファイル名は、index.htmlでもう決めたのです。

index.html の中の</head>の手前に、<link rel="stylesheet" href="style.css" type="text/css"/>がありますね。

真ん中の「href="style.css"」の意味は、「style.cssというファイルと連結しますよ」という設定なのです。ですので、htmlの方でそう決めたら、cssのファイル名もstyleにしないといけません。

今回の原因は、マニュアル14ページ下の作業が正しくできていなかったということです。私の方で「名前を付けて保存」をやり直したところ、正しく機能しています。

ちなみに、マニュアルで「必ずインストールしてください」と解説している「〇〇〇」で、ファイルを開くと一目で分かります。ただのtxtファイルを開いても白黒ですが、cssファイルやhtmlファイルを「〇〇〇」で開くと文字が記号別に色分けされます。

「〇〇〇」を使っていないようでしたら必ずインストールしてください。

では、今回は以上ですが、次回以降お問い合わせいただく場合は、必ず「マニュアル○○ページの○○の部分をやったのだけれども○○になる・・」というように具体的にお問い合わせくださいませ。

では、css.txtをstyle.cssに保存し直して確認してください。