Q&A
<link href="base.css" rel="stylesheet">のパス指定ミス？かと…
それか対象の場所にファイルを置けていないかだと思います
外部CSSがウェブに反映されません。
ChromeでHTMLの一部分のみ表示された状態で検証画面に切り替え、見てみると１エラーが出て、下記のような記述がされています。
GET file:///Users/自分の名前/Desktop/base.css net::ERR_FILE_NOT_FOUND
自分の名前のところはローマ字で書かれています。
解決法など調べてみても一向に解決しません。
どうしたら反映されますか？
表示されるのは
初めての方
・プログラミングとは
・初級編
・お問い合わせ
のみです。
背景色など指定しても反映しません。
本文HTML
<!DOCTYPE html5> <html> <head> <meta charset="utf-8"> <title>初心者向けHP作成</title> <link href="base.css" rel="stylesheet"> <style amp-custom></style> </head> <body></body> </html><div class="header"></div> <div class="header-logo">初めての方</div> <div class="header-list"></div> <ul> <li>プログラミングとは</li> <li>初級編</li> <li>お問い合わせ</li> </ul> <div class="main"></div> <div class="footer"></div>
外部CSS
@charset "utf-8";
link {
display: none;
}
.header{
background-color: #f7f2b4;
height: 70px;
}
.header-logo{
font-size: 300px;
float: left;
padding: 20px;
}
li{
list-style: none;
float: left;
}
.main{
background-color: #bdf7f1;
height: 90px;
}
.footer{
background-color: #ceccf3;
height: 110px;
}
htmlとcssをどこにおいているか教えてください。
コードやエラーはマークダウンのcode機能を利用してご提示ください。
https://teratail.com/questions/238564
CSSが反映されない原因は大して多くありませんし、過去にも多く投稿されています。それらは何一つ参考にならなかったのでしょうか。
回答1件
0
エラーから判断すると、提示されたHTMLファイルを、デスクトップに保存していますよね。
スタイルシートを指定するURLにファイル名のみを指定しているため、同じ場所にスタイルシートのファイルbase.cssを置く必要があります。現在base.cssを保存しているディレクトリから、デスクトップにファイルを移動してください。
あとは、HTMLファイルの冒頭を以下のように修正し、書きかけのscript要素を取り合えず削除すれば、HTMLファイルには問題がなくなります。
HTML
1<!DOCTYPE html> 2<html lang="ja">
投稿2020/09/16 03:46
総合スコア11990
あなたの回答
tips
プレビュー
