Hi, all! I just completed my Dasmoto’s Project and just want some opinions on it. I am in the Front-End Engineer Path and 7% through.
Big question for whomever might know the answer: why does the background image work correctly if I use the link provided by Codecademy, but if I download the image and add it to my resources folder like the other images it will not work. I spent hours trying to solve where I was going wrong and happened upon another thread where the poster commented this was the only way they could fix it. Any thoughts would be appreciated to save myself time in the future. Thanks for reading!
<!DOCTYPE html>
<html>
<head>
<title>Dasmoto's Arts & Crafts</title>
<link href="resources/index.css" type="text/css" rel="stylesheet" />
</head>
<body>
<header id="title">
<h1>Dasmoto's Arts & Crafts</h1>
</header>
<h2 id="brushes">Brushes</h2>
<img src="resources\images\hacksaw.jpeg" alt="stacked paintbrushes" />
<h3>Hacksaw Brushes</h3>
<p>Made of the highest quality oak, hacksaw brushes are known for their weight and ability to hold paint in large amounts.
Available in different sizes. <b>Starting at $3.00/brush.</b></p>
<h2 id="frames">Frames</h2>
<img src="resources\images\frames.jpeg" alt="many colorful picture frames leaning against each other" />
<h3>Art Frames (assorted)</h3>
<p>Assorted frames made of different material, including MDF, birchwood and PDE.
Select frames can be sanded and painted according to your needs. <b>Starting at $2.00/frame.</b></p>
<h2 id="paint">Paint</h2>
<img src="resources\images\finnish.jpeg" alt="colorful tubes of paint" />
<h3>Clean Finnish Paint</h3>
<p>Imported paint from Finland. Over 250 colors available in store, varying in quantity (1 oz. to 8 oz.).
Clean Finnish paint microbinds to canvas, increasing the finish and longevity of any artwork. <b>Starting at $5.00/tube.</b></p>
</body>
</html>
body {
font-family: Helvetica;
}
h1 {
font-size: 100px;
font-weight: bold;
color: khaki;
text-align: center;
background-color: transparent;
}
header {
background-image: url("https://content.codecademy.com/courses/freelance-1/unit-2/pattern.jpeg");
}
h2 {
font-size: 32px;
font-weight: bold;
color: white;
}
#brushes {
background-color: mediumspringgreen;
}
#frames {
background-color: lightcoral;
}
#paint {
background-color: skyblue;
}
b {
color: blue;
}
Also, I do not know why my CSS sheet posted as double-spaced. It is not in Visual Studio.