External Styles are defined on the External Style Sheet, which is linked to the web page(s).
To create a link between a web page and an external style sheet, place a
<link>
element inside the
<head>..</head>
element of that web page. Three attributes of the
<link>
element are required.
Attribute | Description |
---|
type | text/ css |
rel | stylesheet |
href | URL of the external style sheet |
<link rel="stylesheet" type="text/css" href="style.css />
For example create an html page home.html and add the styles for the html elements in a separate css stylesheet file style.css
snippet
<html>
<head>
<style>
a {font-style: underline;}
p {style="color: red;}
h2 {font-style:italic; color: #efefef;}
</style>
</head>
<body>
<h2>This is a Title</h2>
<a href="http://quotefellas.com">Get beautiful inspiring quotes from Quotefells.com </a>
<p> Hard work beats talent when talent doesn't work hard.</p>
</body>
</html>
style.css
snippet
body {padding: 20px;}
a {font-style: underline;}
p {color: red;}
h2 {font-style:italic; color: #efefef;}