0% found this document useful (0 votes)
45 views

Design A Web Page Using CSS

Web Technologies Lab week:Date:Objective:Design a web page using css (Cascading Style Sheets) which includes the following. 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.

Uploaded by

Swarupa Uppuluri
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
45 views

Design A Web Page Using CSS

Web Technologies Lab week:Date:Objective:Design a web page using css (Cascading Style Sheets) which includes the following. 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.

Uploaded by

Swarupa Uppuluri
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

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