Design and develop a recipe page using HTML and CSS.
-
Create a new GitHub repository and name it "Recipe page".
-
Use HTML to structure your page with the following elements. i. A header with the recipe name ii. A section with the ingredients list. iii. A section with the cooking instructions. iv. A section with a photo of the finished dish.
-
Create a separate CSS file and link it to your HTML document using the tag.
-
Use CSS selectors to target specific HTML elements and apply styles.
-
Use CSS properties to apply styles to your page.
-
Use CSS box model to control the layout and spacing of your page elements. Apply margin and padding to create space between elements.
-
Use box-sizing to ensure that your padding and border are included in your element's total width and height.
-
Use floats to position your page elements. For example, use float: left to position the photo of the finished dish next to the cooking instructions.
-
Use CSS colors to enhance the visual appearance of your page. Experiment with different color schemes and use color theory to create a cohesive design.
-
Submit your assignment by sharing the link of the Github repository.