Adding the CSS
Right-click the project folder and add a Stylesheet file called mystyle.css, as shown in Figure 7.10. You will be prompted to choose a Stylesheet type. We’re sticking to CSS files. The rest of the options are fancy, but they all transpile, usually via the Babel library and a WebPack build script, to regular CSS at the end of the day. If you are new to frontend work, I recommend learning plain CSS before branching off into exotic topics such as Less or Sass:
Figure 7.10: Create a new CSS file using File | New | Stylesheet
Be sure to name the file mystyle.css so that it matches what we have in the <link> tag in our HTML file. It also needs to be in the same folder as index.html. Add this code:
body {
background-color: lightblue;
margin: 20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
h1 {
font-size: 32px;
color: navy;
text-decoration: underline;
} Save the file and return to your browser. Don’...