- Advantage of External sheet css is we can apply this external style sheet into anywhere by using single line of code
- <link rel="stylesheet"type="text/css"href="styles.css"media="screen">
- It's reduces the developer's time
- Reuse of code is available here , but in on-line css it is not possible we have to copy entire code if we want to add it into another files/folders.
Lesson3.html:
<!DOCTYPE html>
<html>
<head>
<title>Web Designing Course Lesson3, External-page css</title>
<link rel="stylesheet"type="text/css"href="styles.css"media="screen">
</head>
<body>
<header>
<hgroup>
<h1>Web Designing Course Lesson3</h1>
<h2>Learn HTML 5 and CSS 3</h2>
</hgroup>
</header>
<section>
<article>
<h1>This is my first article - Lesson3</h1>
<p>This is a Tvs Tree Technologies world-wide website,
In this we can learn different technologies</p>
<p>In this website you can learn both front-end and back-end technologies</p>
</article>
</section>
<footer>Copyright © www.tvstreetechnologies.blogspot.com</footer>
</body>
</html>
styles.css:
body{
font-family:arial,sans-serif;
background-color:#C3DDDD;
}
header{
width:80%;
background-color:#094462;
color:white;
margin-left:auto;
margin-right:auto;
text-align:center;
padding:10px;
}
section{
width:80%;
background-color:white;
margin-left:auto;
margin-right:auto;
border-width:5px;
border-style:solid;
border-color:#094462;
padding:5px;
}
footer{
width:80%;
background-color:#094462;
color:white;
margin-left:auto;
margin-right:auto;
padding:10px;
}
Output:
No comments:
Post a Comment