Dasmoto's Arts & Crafts Project Solution

Hi everyone!, here my solution to Dasmoto’s Arts & Crafts Project. Happy coding! :hugs: :love_you_gesture:t3:.

index.html

<!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"> <title>Dasmoto's Arts & Crafts</title> <link rel="stylesheet" href="resources/css/index.css"> </head> <body> <header> <h1>Dasmoto's Arts & Crafts</h1> </header> <main> <section id="brushes"> <h2>Brushes</h2> <img src="resources/images/hacksaw.webp" alt="The Hacksaw Main 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. <strong>Starting at $3.00 / brush.</strong></p> </section> <section id="frames"> <h2>Frames</h2> <img src="resources/images/frames.webp" alt="Art Frames Assorted Pack"> <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.<strong>Starting at $2.00 / frame.</strong></p> </section> <section id="paint"> <h2>Paint</h2> <img src="resources/images/finnish.jpeg" alt="Painting Set"> <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.<strong>Starting at $5.00 / tube.</strong></p> </section> </main> </body> </html>

index.css

body { font-family: Helvetica; } h1, h2, strong { font-weight: bold; } strong { color: blue; } h2 { font-size: 32px; color: white; } header h1 { background-image: url("https://content.codecademy.com/courses/freelance-1/unit-2/pattern.jpeg"); font-size: 100px; color: khaki; text-align: center; } #brushes h2 { background-color: mediumspringgreen; } #frames h2 { background-color: lightcoral; } #paint h2 { background-color: skyblue; }

1 Like

Sweet! Looks good!

I liked your style here:

h1,

h2,

strong {

    font-weight: bold;

}

I forgot that you can easily style a number of different tags in this way. Thanks for the reminder, hopefuly I will have the opportunity to use this technique soon

1 Like

My pleasure mate!.
Actually, I have a serious “problem” when stablishing order in programming, I want to do everything perfectly understandable, so I really commend you read about semantic classes as well all about Codeacademy has prepared for us, is really really useful.

Happy coding! :hugs: :love_you_gesture:t3:

1 Like