When we need a new menu we mostly depend on designers while you can create horzontal menu easily by writing some simple css, let's see how easy it is
<style>
ul.menu
{
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}
ul.menu li
{
float: left;
margin-left:1px;
}
ul.menu a:link, ul.menu a:visited
{
display: block;
background-color: #009900;
text-decoration:none;
padding:5px 15px;
color:#D8B580;
}
ul.menu a:hover{color:#FBF8F4;}
</style>
This is only the css to create a horizontal meny with mouse over effect.
And here is the html for the menu
<ul class="menu">
<li><a href="#">Home</a></li>
<li><a href="#">Product</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
</ul>
To check how it looks likes copy style and html and put into the folowing indicated place
<!DOCTYPE html>
<html>
<head>
Copy and paste style here
</head>
<body>
Copy and paste html here
</body>
</html>
and save the file with html extension and open it in browser and check the mouseover effect.
|
|
| By Flower On 31 Dec, 12 Viewed: 527 |
MVC Search Sort and Paging is common feature we need to use, so let's write the HTML Paging Helper for our project, which will work faster than anyother build-in costum grid system because they contain many other features we don't need for our application and don't support many features we want. In... By Ali Adravi On 07 May 2018 Viewed: 6,392
If you have just started out with HTML5, then boilerplates help you reason out with the framework and help create a professional front end and a robust website. This open source project was created in order to make you HTML5 ready, in case you have just started out. You can directly download and... By Deepa Ranganathan On 01 Jun 2015 Viewed: 428
In some situations we need to create website menu from database, say our application have ability to create pages so that must also need to have a menu item to go to that page. So how to create menu with all those nice CSS and other settings, I think XSLT is best to use in these... By Hamden On 16 Mar 2013 Viewed: 1,885
**HTML5 video and browser compatibility** Now to use video on browser is quite easy, we don't want any flash player any more, simply we can use `<vidoe>` tag and set the video path with src and done. Video tag attributes: - autoplay : "autoplay" or "" (empty string) [Instructs the UA to... By Myghty On 30 Dec 2012 Viewed: 1,516
Social Media Sharing Buttons Without JavaScript I was looking for code to add social media buttons to share my blog on different sites like facebook, twitter, google plus, tumbler and email, I search many websites but could not found any good article which can help to add these buttons without... By Hamden On 29 Dec 2014 Viewed: 2,859