0% found this document useful (0 votes)
117 views2 pages

Design A Web Page Using CSS

The document outlines a web technologies lab assignment focused on designing a web page using CSS. It specifies requirements such as using various fonts, setting background images, controlling image repetition, defining link styles, working with layers, and adding a customized cursor. An example HTML code is provided that demonstrates these CSS features.

Uploaded by

Swarupa Uppuluri
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
117 views2 pages

Design A Web Page Using CSS

The document outlines a web technologies lab assignment focused on designing a web page using CSS. It specifies requirements such as using various fonts, setting background images, controlling image repetition, defining link styles, working with layers, and adding a customized cursor. An example HTML code is provided that demonstrates these CSS features.

Uploaded by

Swarupa Uppuluri
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

Web Technologies Lab

Week:- Date:-
Objective:-
Design a web page using CSS (Cascading Style Sheets) which includes the following
1) Use different font, styles
2) Set a background image for both the page and single elements on the page.
3) Control the repetition of the image with the background-repeat property.
4) Define styles for links
5) Work with layers
6) Add a customized cursor
css.html:-
<html>
<head>
<div style="position:absolute; top:100; font-size:80px; z-index:3;">LAYER 3</div>
<div style="position:absolute; top:120; left:50; color:red; font-size:80px; z-index:2">LAYER
2</div>
<div style="position:absolute; top:160; left:75; color:green; font-size:80px; z-index:1">LAYER
1</div>
<style type="text/css">

body
{
background-image: url('Tulips.jpg');
background-repeat:repeat-x;
background-attachment:scroll;
background-color:pink
background-size:50px;
}
h1{color:red;}
p{color:green;}
a:link{text-decoration : none;
color:pink;
background-color: blue};
a:visited{text-decoration :none;
color:orange;
background-color: blue};
a:hover{text-decoration : underline;
color:white;
cursor:help;
background-color: red};
a:active{text-decoration : underline};

Web Technologies Lab

</style>
</head>
<body>
<a href="regs.html">registration</a>
<p>keerthi</p>

</body>
</html>

You might also like