Lab 4 - CSS
Lee Xhi Qing AI160225
Wong Xiao Feng AI160247
embedded.html
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="color.css">
<title>Trillium Media Design</title>
<style>
body { background-color: #e6e6fa; color: #191970; text-align: center; }
h1 { background color: #191970; color: #0000CD; }
h2 { background color: #aeaed4; color: #191970; }
</style>
<meta charset="utf-8">
</head>
<body>
<h1>Trillium Media Design</h1>
<div><a href="index.html">Home</a> <a href="services.html">Services</a> <a href="contact.html">Contact</a></div>
<h2>New Media and Web Design</h2>
<article>Trillium Media Design will bring your company's Web presence to the next level.<br>
We offer a comprehensive range of services:</article>
<ul>
<img src="WD.jpg" width="500" height="250">
<li>Website Design</li><br>
<img src="IA.jpg" width="500" height="250">
<li>Interactive Animation</li><br>
<img src="ECS.jpg" width="500" height="250">
<li>E-Commerce Solutions</li><br>
<img src="US.jpg" width="500" height="250">
<li>Usability Studies</li><br>
<img src="SEO.jpg" width="500" height="250">
<li>Search Engine Optimization</li><br>
</ul>
<h2>Meeting Your Business Needs</h2>
<article>Our expert designers are creative and eager to work with you.<br>
Take advantage of the power of Web 2.0!</article>
<footer><div>Copyright © 2012 Your Name Here</div></footer>
</body>
</html>
Wong Xiao Feng AI160247
embedded.html
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="color.css">
<title>Trillium Media Design</title>
<style>
body { background-color: #e6e6fa; color: #191970; text-align: center; }
h1 { background color: #191970; color: #0000CD; }
h2 { background color: #aeaed4; color: #191970; }
</style>
<meta charset="utf-8">
</head>
<body>
<h1>Trillium Media Design</h1>
<div><a href="index.html">Home</a> <a href="services.html">Services</a> <a href="contact.html">Contact</a></div>
<h2>New Media and Web Design</h2>
<article>Trillium Media Design will bring your company's Web presence to the next level.<br>
We offer a comprehensive range of services:</article>
<ul>
<img src="WD.jpg" width="500" height="250">
<li>Website Design</li><br>
<img src="IA.jpg" width="500" height="250">
<li>Interactive Animation</li><br>
<img src="ECS.jpg" width="500" height="250">
<li>E-Commerce Solutions</li><br>
<img src="US.jpg" width="500" height="250">
<li>Usability Studies</li><br>
<img src="SEO.jpg" width="500" height="250">
<li>Search Engine Optimization</li><br>
</ul>
<h2>Meeting Your Business Needs</h2>
<article>Our expert designers are creative and eager to work with you.<br>
Take advantage of the power of Web 2.0!</article>
<footer><div>Copyright © 2012 Your Name Here</div></footer>
</body>
</html>
color.css
body { background-color: #E6E6FA;
color: #191970;
font-family: Arial, Verdana, sans-serif; text-align:center; }
}
h1 { background-color: #191970;
color: #E6E6FA;
line-height: 200%;
font-family: Georgia, “Times New Roman”, serif; };
h2 { background-color: #AEAED4;
color: #191970;
font-family: Georgia, “Times New Roman”, serif;
text-align: center; }
p { font-size: .90em;
text-indent: 3em; }
ul { font-weight: bold; list-style-position: inside;}
li{list-style-position: inside;}
footer{font-family: comic sans ms body copy;
font-size: 0.8em;}
Comments
Post a Comment