6. Create a webpage to demonstrate the use of external Cascading Style Sheets
Code for mystyle.css:
body{
background-color: orange;
font-family:serif;
color: blue;
font-size: 26pt;
}
h3{ color:blue; }
.M { color: Magenta; font-style:italic }
.Y { color:yellow; font-style:bold }
.R { color:Red; text-decoration:underline }
ul {
list-style-type: square;
}
Code for External.html:
<HTML>
<HEAD>
<TITLE>External CSS</TITLE>
<LINK REL="stylesheet" HREF="mystyle.css">
</HEAD>
<BODY>
<H3>Applying Styles using External Cascading Style Sheets</H3>
<span class="M">This text is Italic and Magenta.</span><br>
<span class="Y">This text is Bold and Yellow.</span><br>
<span class="R">This text is underlined and Red.</span><br>
<P>This list is applied with External CSS:</P>
<ul>
<li>Element1
<li>Element2
</ul>
</BODY>
</HTML>
Code for mystyle.css:
body{
background-color: orange;
font-family:serif;
color: blue;
font-size: 26pt;
}
h3{ color:blue; }
.M { color: Magenta; font-style:italic }
.Y { color:yellow; font-style:bold }
.R { color:Red; text-decoration:underline }
ul {
list-style-type: square;
}
Code for External.html:
<HTML>
<HEAD>
<TITLE>External CSS</TITLE>
<LINK REL="stylesheet" HREF="mystyle.css">
</HEAD>
<BODY>
<H3>Applying Styles using External Cascading Style Sheets</H3>
<span class="M">This text is Italic and Magenta.</span><br>
<span class="Y">This text is Bold and Yellow.</span><br>
<span class="R">This text is underlined and Red.</span><br>
<P>This list is applied with External CSS:</P>
<ul>
<li>Element1
<li>Element2
</ul>
</BODY>
</HTML>
No comments :
Post a Comment