- ベストアンサー
ｃｓｓの、一つ目の記述がHTML側に反映されません。
スタイルシートの超初心者です。 <style type="text/css"> body {background-color:#87cefa;} h1 {background-color:#ffddaa;} と記述すると、bodyの記述がHTMLの表示に反映されず、順番を入れ替えても、一つ目になった記述が反映されません。 <style type="text/css"> } body {background-color:#87cefa;} h1 {background-color:#ffddaa;} 試しに、上の様に「}」を挟んだら反映されたのですが、こんなのをダミーで入れているのは、とっても納得が行きません。どなたか、原因を教えて頂けないでしょうか？
- prussianblue
- お礼率85% (46/54)
- HTML
- 回答数3
- ありがとう数3
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
cssは別ファイルでもっているんですよね？ cssを反映させるHTMLファイルには ---------------------------------- <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="css置いてあるディレクトリとファイル名.css"> ---------------------------------- cssファイルには、 ---------------------------------- body {background-color:#87cefa;} h1 {background-color:#ffddaa;} ---------------------------------- と、<style type="text/css">を記述する必要はありませんよ。
その他の回答 (2)
- koutarou504
- ベストアンサー率44% (182/407)
推測するにその（ダミーを入れた）あたりに ゴミが入っているのではないでしょうか。 とにかく一つ目といわれる記述の前に不適切な何かがあり それが一つ目の記述を適切に１つの塊（または開始）と認めていないのでしょう。 尚、ゴミとは目に見えるとは限りませんので・・・。 どうしてもダミーでの回避しか実現できなかった場合は、 body {background-color:#87cefa;} body {background-color:#87cefa;} と繰り返し２つ以上書くとか body {color:#000000;} body {background-color:#87cefa;} h1 {background-color:#ffddaa;} と無効になってもよさそうな記述をとりあえず書いておくとか・・・。 一応 <style type="text/css"> \ body {background-color:#87cefa;} h1 {background-color:#ffddaa;} と「\」を明確にゴミとして記述する事でも再現しました。 とりあえずその空白の１行が気になる処です・・・。
お礼
有難う御座います。独立ファイルとしてのcssと明記し忘れた為に、ご迷惑をおかけ致しました。
補足
早々のご回答有難う御座います。見えないゴミ説を元に、一から新しいファイルを作って記述し直して見たのですが、やはり、同じ状況でした。書き忘れてしまいましたが、別ファイルとしてcssファイルを作っています。サーバに置かずローカルで確認している状態ですが、自宅・職場、どちらのＰＣにおいても状況が変わらず、ダミーの記号を入れると作用することから、htmlファイル側の記述ミス、ＰＣのブラウザ側の設定、どちらの可能性も低そうなのですが・・・。
こんばんは。cssを使うとデザインの自由度が増しますね。 ご質問者さんの例文をコピペして下のように不足のタグを加えてみましたが、特に問題はなくボディの空色もh1の肌色も背景色は表示されたようですが・・・？どうなんでしょう。 <HTML><HEAD> <TITLE></TITLE> <STYLE type="text/css"> <!-- body { background-color:#87cefa;} h1 { background-color:#ffddaa;} --> </STYLE></HEAD> <BODY> <H1>あ</H1> </BODY></HTML>
お礼
有難う御座います。独立ファイルとしてのcssと明記し忘れた為に、ご迷惑をおかけ致しました。
補足
早々のご回答有難う御座います。一から新しいファイルを作って記述し直して見たのですが、やはり、同じ状況でした。書き忘れてしまいましたが、別ファイルとしてcssファイルを作っています。エディタにはノートパッドを使っているのですが・・・。ちなみに<STYLE type="text/css"> を削除して、 body { background-color:#87cefa;} h1 { background-color:#ffddaa;} だけにしたら、ＯＫだったのですが、やはり本来の記述ルールとしては、 <STYLE type="text/css"> を付けるのですよね・・・？
お礼
有難う御座います。納得です。書店で購入した書籍で、独立ファイルにしたcssの記述例にも先頭に<style type="text/css">が記述してあったのですが、きっと私が解釈を誤ったのですね。