<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Navigation Bar</title>
<style>
/* now i am discuss my most favourite thing in css or which i waited for a lon now i am ready to do so . this is called al navigation bar about which i will collect some information bout it but i know that it is not more important for this navigation bar so wanna get more information about that which will be on another class now some discussion whcih will be allready discussed in past class */
.navbar {
/* background-color: brown; */
color: white;
}
.list {
list-style: none;
}
a {
color: rgb(226, 175, 175);
text-decoration: none;
float: left;
margin: 13px 20px;
}
a:hover {
color: red;
}
</style>
</head>
<body>
<div class="navbar">
<!-- for the navigation bar we will create a list which is used in the given some different name to the navigation bar then we will aply some properties that float it to the left side and made it more affective and thsi list is may be ordered or unordered i will choose an unordered list which is used to writeen diffrent names like home contcta nd menu etc. so next thing is that i should used a search baar but now i forget to use this bar soo i will not continou till now but some properties are applied which are i think may be not more helpfull but i will do that for my help and then i will learn that tomorrow inshaAllah now this thing is just used for the today study -->
<ul class="list">
<li class="home">
<a href=""> Home </a>
</li>
<li class="About">
<a href=""> About </a>
</li>
<li class="Contact Us">
<a href=""> Contact Us </a>
</li>
<li class="Men">
<a href=""> Menu </a>
</li>
<p>
<strong>
<a href="thank"> Thank yOU </a>
</strong>
</p>
</ul>
</div>
<!-- todays work is my favourite but i can not get complete information aboutthat so now i will ends there but i will studied it later more importatntly which will help me to create an effective website now i am end with there and satrt studied in the next class -->
</body>
</html>
Tags:
HTML Cource