Make a basic page using HTML & CSS.

In this lab exercise, you will be creating your own page using HTML & CSS. There is nothing to download in Frodo as you’ll be starting from scratch.

1. Decide what you want to make your page about – it could be about a hobby, a book, a movie, an event, a place, or anything else you can think of

2. Sketch out a basic layout (you can do this anywhere, you won’t be submitting it)

3. Create a folder for your project, inside the folder, create an index.html file and a styles.css file

4. In the HTML file, set up your basic structure - doctype, head, body

5. Start coding! I recommend breaking down your sketch into small parts. Do all of the HTML and then all of the CSS before moving on to the next part. Don’t worry if your code is messy or repetitive right now – you’re learning!

Once you’ve created your basic page, do some HTML & CSS research and see what you can add! We’ll cover classes & ids, the position, display, & flexbox properties, as well as semantic HTML later in this unit; so use your time in this lab to look at other topics. W3Schools and MDN are both great reference sites for HTML & CSS.

HTML

• tables

• audio tags

• video tags

• HTML entities

CSS

• box-shadow

• box-sizing

• pseudo classes

• float