/js-heart-css

Use Javascript & jQuery to select elements in an HTML file and manipulate their CSS.

Primary LanguageHTML

JS ❤︎ CSS

  • Approx. completion time: 1 hour
  • Deliverables: 1 HTML file, 1 CSS file, 1 JS file, images

Use Javascript & jQuery to select elements in an HTML file and manipulate their CSS.

  • Fork this repository.
  • Perform the following tasks on the HTML:
    1. Select <header> — add .masthead
    2. Select <h1> — remove .big-heading & add .logo
    3. Select <main> — add .wrapper
    4. Select the first <p> inside <main> — add .intro
    5. Select the <h2> tags — add .slug-head
    6. Select the list inside <main> — add .slug-list
    7. Select the images — add .slug-img
    8. Select the first item in the list — add .slug-list-first
    9. Select the last item in the list — add .slug-list-last
    10. Select <dl> — add .classification
    11. Select the <dt> tags — remove .big-label
    12. Select the last item in the list — make it visible
  • DO NOT change the HTML.
  • DO NOT change the CSS.
  • Run it through Markbot and make sure it passes all the checks.

Goal

Visually match the images in the “screenshots” folder.

Hand in

Drop this folder into your Markbot application. Make sure to fix all the errors. And submit to Canvas using Markbot.