Q&A
bodyに背景色（黒とか分かりやすいの）を入れるとどうでしょうか。
「きちんと反映されない」がどこの話をしているのかそれこそきちんと提示された方が良いです。
全てなのか一部なのかで話が全く違ってきます。
（というかdocument.write()で書くのは悪手、と本件と関係ない指摘をしたくなる）
いつもお世話になっております。
現在、HTMLとCSSにて入力フォームを作成中なのですが、
CSSを編集後、Chromeで更新しても一向にCSSが反映がされません。
しかし、Safariからページを開くときちんと反映されている状態です。
以下、原因を探ってみました。
・CSS構文検証で、コード自体に問題なし
・HTML構文検証でトラブルなし
・Chromeのキャッシュ削除
・Chromeの再起動
・HTMLエラーチェッカーで反応しない（ここが原因？）
以上、解決になっていないですが試してみました。
何か他にアドバイスがありましたらご指摘いただけますと幸いです。
よろしくお願いします。
念のため、下記にコードの原文を記載します。
HTML
1<!doctype html> 2<html lang="ja"> 3 4<head> 5<meta charset="utf-8"> 6<title>お問い合わせフォーム</title> 7<link rel="stylesheet" type="text.css" href="style.css"> 8</head> 9 10<body> 11 12<h1>お問い合わせフォーム</h1> 13<form method="post" action="mail_confirm.php"> 14 <div> 15<label>名前</label> 16<br> 17<input type="text" class="text" size="35" name="箱の名前"> 18 </div> 19 20 <div> 21 <label>メールアドレス</label> 22 <br> 23 <input type="text" class="text" size="35" name="XXX"> 24 </div> 25 26 <div> 27 <label>年齢</label> 28 <br> 29 <select class="dropdown" name="XXX"> 30 <option>選択してください</option> 31 <script> 32 for(var i= 18; i<= 65; i++){ 33 document.write("<option>"); 34 document.write(i+"歳"); 35 document.write("</option>"); 36 } 37 </script> 38 </select> 39 </div> 40 41 <div> 42 <label>コメント</label> 43 <br> 44 <textarea cols="35" rows="7" name="XXX" placeholder="お問い合わせ内容"></textarea> 45 </div> 46 47 <div> 48 <input type="submit" value="送信する"> 49 </div> 50</form> 51</body> 52</html>
CSS
1body{font-family: "Hiragino Kaku Gothic ProN","メイリオ",sans-serif; 2} 3 4h1{ margin: 0 auto; /*CSSの中央*/ 5margin-top:30px; 6margin-bottom: 20px; 7border-left: 4px red solid; 8background-color: beige; 9padding-top: 5px; 10padding-bottom: 5px; 11padding-left: 15px; 12width: 500px; 13font-size: 20px; 14} 15 16form{margin: 0 auto; 17background-color: #fbfbfb; 18border: 3px #ebebeb solid; 19border-radius:10px; 20width: 500px; 21} 22 23form div{ 24 padding:15px; 25} 26 27.text,textarea,.dropdown{ 28 border: 1px solid #dfdfdf; 29 padding: 5px; 30 color: #999; 31 background: #fff; 32} 33 34.submit{ 35 border: 1px solid lightgray; 36 padding: 4px 10px; 37 color:white; 38 background-color: #bfbfbf; 39 border-radius: 5px; 40 border-bottom: solid 2px gray; 41}
質問いただきありがとうございます
Chromeのconsoleで404エラーなどは出ていますか？
m.ts10806 さま
ご指摘ありがとうございました。
今回は、CSS全てが反映されないという問題でした。補足が足りず申し訳ありません。
HTMLでの入力ミスが発覚し、無事解決いたしました。
確かにここのdocument.writeは()書きになっていますね。
質問以外でのご指摘もありがとうございます！
bochan2 さま
ご質問ありがとうございます。
Chromeのconsoleで404エラーは見受けられませんでしたが、今回はHTMLにCSSを適用する際の入力ミスが原因でした。
今後ともよろしくお願いします。
質問は編集できますので適宜ご対応いただければと。
あと補足ですが、html５になって初期値が設定されている属性も多いので
おまじないのように全部書かなくて良いものもあります。
調べておくと後々役に立ちます。
回答1件
0
ベストアンサー
これを
html
1<link rel="stylesheet" type="text.css" href="style.css">
こう修正したらなおりませんか？
html
1<link rel="stylesheet" type="text/css" href="style.css">
投稿2019/12/23 14:28
総合スコア24
yadok さま
ご回答ありがとうございました。
「.」を「/」に変更するとChromeできちんと反映されました！
HTML文書にCSSを適用させる時は、この部分で「/」でしたね。
ご指摘助かります。
今後ともよろしくお願いします。
あなたの回答
tips
プレビュー
