External-Style Sheets

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.

AttributeDescription
typetext/ css
relstylesheet
hrefURL 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;}
Related Tutorial
Follow Us
https://www.facebook.com/Rookie-Nerd-638990322793530 # # # # #