Stylesheets

Embedding our CSS right on the page is OK for simple tasks, but we lose the ability to easily share styles between documents. Better to extract our styles into a separate document called a stylesheet.

We hook up a stylesheet using a link tag, like so:

<link rel="stylesheet" type="text/css" href="styles.css">

We then extract our rules into a file called styles.css which contains all our rules. Note that we can link as many stylesheets as we like, though more stylesheets does mean more HTTP requests.

h1 {
color:red;
}

Exercise - extract a stylesheet.

Refactor your last exercise to use a stylesheet.

Do you like Email? Do You Like JavaScript?

Sign up for occasional emails covering modern Web Development topics such as Angular 2 and React. You can unsubscribe at any time.

We totally respect your email privacy

comments powered by Disqus