Styling with Emmet

Emmet can also be used in CSS.

Add a background image to the page

In the "index.html" page in the "start" project, add a style tag just below the link tag.

  • Enter style and press tab

Inside the style tag, create a style for the main html element.

Add a background image and set it's properties...

  • Enter bgi press tab

    • Set the url to "background.jpeg"

  • Enter bgr press tab

    • Set the value to "no-repeat"

  • Enter bgs press tab

    • Set the value to "cover"

  • Set the height to 100%

    • Enter h100p press tab

  • Set the min-height to 1400px

    • Enter mh1400 press tab

Style the rest of the page

Add a style for the body element

  • Set the "background-color" to "RGBA(255, 255, 255, 0.8)

    • Enter bgc press tab

  • Set the height to 100%

    • Enter h100p

Add a style for the #app ID

  • Set the max-width to 800px

    • Enter maw800 press tab