In this lab, we're going to be taking a deep dive into CSS selectors. When styling your HTML it's important to be able to easily identify and select the exact elements that you want to style.
If you open up your index.html file you'll see a full page of HTML ready to be styled. This file has been linked to the style.css file that you also have access to. You may notice that when you preview the HTML file, nothing on the page seems to actually be styled. This is because despite the fact that the styling rules have been written for you (in style.css), the selectors used to identify which elements the rules will apply to have not been.
Your job is to create each of the selectors (detailed below) editing ONLY the css, not the HTML to achieve this final result:
The details for each selector are in the style.css file, replace each "selector_i" with the correct selector to see styling begin to occur on the page. You haven't yet been taught enough about CSS selectors to do this all, so reference some documentation for some really great information to get you going - you won't be able to get past selector_3 without referencing the documentation. Make sure to use control f to search through the page for specific key words and feel free to search for other resources if you aren't finding what you need!
When you first preview the HTML, you'll see a title, some other text and a lot of red. Don't worry, by the end of this lab your page will be exactly like the game we're trying to build!