Scribd
Upload
23 views

Webpage Using Navigation Bar (CSS)

The document provides code for a webpage navigation bar using CSS. It includes HTML and CSS code to create an unordered list with no bullets and floating list items for the navigation links, with hover and active link styling.

Uploaded by

Murali Murali
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
23 views

Webpage Using Navigation Bar (CSS)

The document provides code for a webpage navigation bar using CSS. It includes HTML and CSS code to create an unordered list with no bullets and floating list items for the navigation links, with hover and active link styling.

Uploaded by

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

WEBPAGE USING NAVIGATION BAR(CSS)

<!Doctype html>
<html>
<head>
<style>
ul{
list-style-type:none;
margin:0;
padding:0px;
overflow:hidden;
background-color:green;
}
li{
float:left;
border-right:1px solid blue;
}
li a{
display:block;
color:black;
font-size:center;
padding:10px 20px;
text-decoration:none;
}
.active{
background-color:red;
color:white
}
li a:hover{
background-color:orange;
color:white;
}
</style>
</head>
<body>
<ul>
<li><a class="active"herf="#home">Home<a></li>
<li><a herf="#">java</a></li>
<li><a herf="#">HTML</a></li>
<li><a herf="#">CSS</a></li>
</ul>
</body>
</html>
Output:

You might also like