Code:
<html>
<head>
<link rel="stylesheet" type="text/css" href="Wt8.css">
<style type="text/css">
h2{
font-size:40px;
font-family: Arial;
text-align: center;
}
</style>
</head>
<body>
<h1 style="font-size:50px; text-align:left; font-family:TimesNewRoman; ">Inline Style</h1>
<h2>Internal Style</h2>
<h3>External Style</h3>
</body>
</html>
Wt8.css:
h3{
font-size: 40px;
font-family: Courier;
text-align: right;
}
Output:
Code:
<html>
<head>
<style type="text/css">
a{
font-family:Helvetica;
font-size: 30px;
}
a:visited{
color: red;
}
a:link{
color: yellow;
}
a:hover{
color: green;
font-size: 40px;
}
p{
text-align: center;
font-size: 50px;
font-family: Arial;
color: blue;
}
</style>
</head>
<body>
<p>Click On Below Links And You Will Be Redirected</p>
<ul type="square">
<li><a href="https://www.google.co.in/?q=hello U">iPhoneX</a></li>
<li><a href="https://www.google.co.in/">iPhone8</a></li>
<li><a href="https://www.google.co.in/?q=bye U">iPhone7</a></li>
</ul>
</body>
</html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="Wt8.css">
<style type="text/css">
h2{
font-size:40px;
font-family: Arial;
text-align: center;
}
</style>
</head>
<body>
<h1 style="font-size:50px; text-align:left; font-family:TimesNewRoman; ">Inline Style</h1>
<h2>Internal Style</h2>
<h3>External Style</h3>
</body>
</html>
Wt8.css:
h3{
font-size: 40px;
font-family: Courier;
text-align: right;
}
Output:
<html>
<head>
<style type="text/css">
a{
font-family:Helvetica;
font-size: 30px;
}
a:visited{
color: red;
}
a:link{
color: yellow;
}
a:hover{
color: green;
font-size: 40px;
}
p{
text-align: center;
font-size: 50px;
font-family: Arial;
color: blue;
}
</style>
</head>
<body>
<p>Click On Below Links And You Will Be Redirected</p>
<ul type="square">
<li><a href="https://www.google.co.in/?q=hello U">iPhoneX</a></li>
<li><a href="https://www.google.co.in/">iPhone8</a></li>
<li><a href="https://www.google.co.in/?q=bye U">iPhone7</a></li>
</ul>
</body>
</html>
Output:
Code:
<html>
<head>
<style type="text/css">
table th{
background-color: purple;
color: white;
}
table tr{
font-family: Arial;
font-size: 20px;
}
table tr:hover{
background-color: green;
}
ul{
list-style: squares;
}
ul li{
font-size: 20px;
font-family: Arial;
}
ul li:hover{
color: red;
}
</style>
</head>
<body>
<center><h3>Key Specs iPhone7</h3>
<table border="2" cellpadding="5" cellspacing="5">
<tr><td>Display</td><td>Processor</td><td>Front Camera</td></tr>
<tr><th>4.70-inch</th><th>quad core</th><th>7-megapixel</th></tr>
<tr></tr>
<tr><td>Resolution</td><td>OS</td><td>Storage</td></tr>
<tr><th>750x1334 pixels</th><th>iOS 10</th><th>32GB</th></tr>
<tr></tr>
<tr><td>Rear Camera</td><td>Price</td></tr>
<tr><th>12-megapixel</th><th>Rs. 45,999</th></tr>
</table>
</center>
<br>
<ul>
<li>iPhone7</li>
<li>iPhone7+</li>
<li>iPhone8</li>
<li>iPhone8 plus</li>
<li>iPhoneX</li>
</ul>
</body>
</html>
Output:
