前提・実現したいこと
ドットインストールでCSS学習中(第9回)
背景画像を表示したい
htmlでは画像は正確に表示されていた
imgフォルダ内にheader.png
https://teratail.com/questions/178413
以前同様の質問者への回答に目を通しました。
発生している問題・エラーメッセージ![イメージ説明]
CSSで指定した画像を表示させたい・
該当のソースコード
html
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="utf-8"> 5 <title>太郎のポートフォリオサイト</title> 6 <link rel="icon" href="favicon.ico"> 7 <meta name="description" content="太郎のポートフォリオサイトです。"> 8 <!-- <style> 9 h1 { 10 color: red; 11 } 12</style> --> 13<link rel="stylesheet" href="CSS/styles.css"> 14</head> 15<body> 16 <header> 17 <!-- 18 ol:ouder list 19 ul:unouder list 20 li:listitem 21 --> 22 <nav> 23 <ul> 24 <li> 25 <a href="index.html"> 26 HOME 27 </a> 28 </li> 29 <li> 30 <a href="about.html"> 31 ABOUT 32 </a> 33 </li> 34 </ul> 35 </nav> 36 <!-- <img src="img/header.png" width="400" height="130" alt="ヘッダー画像"> --> 37 <!-- cssのheaderで指定し直す --> 38</header> 39 40```css 41header { 42background-color: pink; 43text-align: right; 44/* ↑右揃え */ 45padding: 10px; 46background-image: url(../img/header.png); 47height: 240px; 48} 49
試したこと
画像やフォルダ名の入力ミスを避けるためにコピペで指定
header.pngをCSSフォルダ内にいれ、
background-image: url(header.png);
保存と再読込するも画像が表示されない。
htmlがあるmyphortfolio内にheader.pngを移し、
background-image: url(../header.png);
これも表示されない。
回答1件
あなたの回答
tips
プレビュー