Hi there,
Would someone be able to look over my HTML and CSS code for the “Dasmoto’s Arts & Crafts” project? The website looks exactly like it should, but if someone could provide feed back on:
in the CSS, does the h1,h2,h3,p selector make sense, or should I just use * instead
are the alt values on the images descriptive
and does the usage of the span make sense, or should it be an em since that text is essentially emphasized
Thank you for any feedback you can provide!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./Resources/Css/index.css">
<title>Dasmoto's Arts & Crafts</title>
</head>
<body>
<header>
<h1>Dasmoto's Arts & Crafts</h1>
</header>
<main>
<section>
<h2 id="brushes">Brushes</h2>
<img src="./Resources/Images/hacksaw.jpeg" alt="an assortment of hacksaw brushes">
<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. <span class="starting-price">Starting at $3.00/brush.</span></p>
</section>
<section>
<h2 id="frames">Frames</h2>
<img src="./Resources/Images/frames.jpeg" alt="a variety of colourful picture frames">
<h3>Art Frames (assorted)</h3>
<p>Assorted frames made of different materials, including MDF, birchwood, and PDE. Select frames can be sanded according to your needs. <span class="starting-price">Starting at $2.00/frame.</span></p>
</section>
<section>
<h2 id="paint">Paint</h2>
<img src="./Resources/Images/finnish.jpeg" alt="open tubes of paint">
<h3>Clean Finnish Paint</h3>
<p>Imported paint from Finland. Over 256 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. <span class="starting-price">Starting at $5.00/tube.</span></p>
</section>
</main>
</body>
</html>
h1,
h2,
h3,
p {
font-family: helvetica, sans-serif;
}
h1 {
font-size: 100px;
font-weight: bold;
color: khaki;
text-align: center;
background-color: darkcyan;
background-image: url("../Images/pattern.jpeg");
}
h2 {
font-size: 32px;
font-weight: bold;
color: white;
}
.starting-price {
font-weight: bold;
color: blue;
}
#brushes {
background-color: mediumspringgreen;
}
#frames {
background-color: lightcoral;
}
#paint {
background-color: skyblue;
}