The border-radius property allows you to add rounded corners to elements.

Select All

Select All

JavaScript is a scripting language originally developed by Netscape to add interactivity and power to web documents.

Java is completely different from JavaScript- it's more powerful, more complex, and unfortunately, a lot harder to master.

Activity Monitor

chez-vous
DHTML MENU
DHTML EFFETS
DHTML IMAGES DIAPORAMAS
- DHTML IMAGES
- DHTML DIAPORAMAS
DHTML CSS BIBLIOTHÈQUE

clicker sur menu

fermer

ajax
css-html
freebies
icon
inspiration
javascript
logo

"

Rechercher dans ce blog

MENU horizontal simple multicolonnes Modèle NOIR,Bleu

MENU multicolonnes Modèle NOIR,Bleu,Comme toujours pas de téléchargement copier coller le HTML CSS ET vous pouvez modifier tous.Menu avec arriére plan backgrond noir,bleu et bleu light avec sub-sub-sub-submenu COOL !!!!

Démo
HTML CODE
CSS CODE

HOME
PRODUCT INFO
SAMPLES
- Neon Template
  Green Theme
  
  Liliac Theme
  
  Blue Theme
  
  Neon Theme
  
  Orange Theme
- New Templates
DOWNLOAD

<ul id="css3menuu" class="topmenu" style="position: relative;top: -25px">

<li class="topmenu"><a href="#" title="HOME">HOME</a></li>

<li class="topmenu"><a href="#" title="PRODUCT INFO"><span>PRODUCT INFO</span></a>

<div class="submenu" style="width:376px;">

<div class="column" style="width:50%"><ul>

<li><a href="#" title="2.1 Features">2.1 Features</a></li>

<li><a href="#" title="2.2 Installation"><span>2.2 Installation</span></a>

<div class="submenu">

<div class="column"><ul>

<li><a href="#" title="2.2.1Description of Files">2.2.1Description of Files</a></li>

<li><a href="#" title="2.2How to Setup">2.2How to Setup</a></li>

</ul></div></div>

</li>

<li><a href="#" title="2.3 Parameters Info">2.3 Parameters Info</a></li>

</ul></div>

<div class="column" style="width:50%"><ul>

<li><a href="#" title="2.4 Dynamic Functions">2.4 Dynamic Functions</a></li>

<li><a href="#" title="2.5 Supported Browsers"><span>2.5 Supported Browsers</span></a>

<div class="submenu" style="width:286px;">

<div class="column" style="width:50%"><ul>

<li><a href="#" title="Firefox">Firefox</a></li>

<li><a href="#" title="Internet Explorer">Internet Explorer</a></li>

<li><a href="#" title="Opera">Opera</a></li>

</ul></div>

<div class="column" style="width:50%"><ul>

<li><a href="#" title="Safari">Safari</a></li>

<li><a href="#" title="Google Chrome">Google Chrome</a></li>

<li><a href="#" title="Konqueror">Konqueror</a></li>

</ul></div></div>

</li>

<li><a href="#" title="CSS3 Info">CSS3 Info</a></li>

</ul></div></div>

</li>

<li class="topmenu"><a href="#" title="SAMPLES"><span>SAMPLES</span></a>

<div class="submenu" style="width:441px;">

<div class="column" style="width:33.33%"><ul>

<li><a href="#" title="Android Template">Android Template</a></li>

<li><a href="#" title="Blocks Template"><span>Blocks Template</span></a>

<div class="submenu" style="width:342px;">

<div class="column" style="width:50%"><ul>

<li><a href="#" title="Blue Theme">Blue Theme</a></li>

<li><a href="#" title="Green Fodder Theme">Green Fodder Theme</a></li>

<li><a href="#" title="Grey Theme">Grey Theme</a></li>

</ul></div>

<div class="column" style="width:50%"><ul>

<li><a href="#" title="Light Theme">Light Theme</a></li>

<li><a href="#" title="Orange Theme">Orange Theme</a></li>

<li><a href="#" title="Purple Theme">Purple Theme</a></li>

</ul></div></div>

</li>

<li><a href="#" title="Elegant Template">Elegant Template</a></li>

</ul></div>

<div class="column" style="width:33.33%"><ul>

<li><a href="#" title="Frame  Template">Frame  Template</a></li>

<li><a href="#" title="Fresh Template">Fresh Template</a></li>

<li><a href="#" title="Mac Template">Mac Template</a></li>

</ul></div>

<div class="column" style="width:33.33%"><ul>

<li><a href="#" title="Neon Template"><span>Neon Template</span></a>

<div class="submenu" style="width:266px;">

<div class="column" style="width:50%"><ul>

<li><a href="#" title="Green Theme">Green Theme</a></li>

<li><a href="#" title="Liliac Theme">Liliac Theme</a></li>

<li><a href="#" title="Blue Theme">Blue Theme</a></li>

</ul></div>

<div class="column" style="width:50%"><ul>

<li><a href="#" title="Neon Theme">Neon Theme</a></li>

<li><a href="#" title="Orange Theme">Orange Theme</a></li>

</ul></div></div>

</li>

<li><a href="#" title="New Templates">New Templates</a></li>

</ul></div></div>

</li>

<li class="topmenu"><a href="#" title="DOWNLOAD">DOWNLOAD</a></li>

</ul>

<style>
 ul#css3menuu,ul#css3menuu ul{
 margin:0;list-style:none;padding:0 11px 5px;}
ul#css3menuu,ul#css3menuu .submenu{
 background-color:#3D3E3F;border-width:1px;border-style:solid;border-color:#515253 #3D3E3F #2B2B2C #3D3E3F;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;}
ul#css3menuu .submenu{
 display:none;position:absolute;left:0;top:97%;-moz-box-shadow:3.5px 3.5px 3px #333;-webkit-box-shadow:3.5px 3.5px 3px #333;box-shadow:3.5px 3.5px 3px #333;float:left;background-color:#429ADB;border-width:1px;border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;-webkit-border-radius:0;-webkit-border-bottom-right-radius:6px;-webkit-border-bottom-left-radius:6px;border-style:solid;border-color:#429ADB #357BAF #357BAF #357BAF;padding:6px 5px 11px;}
ul#css3menuu li:hover>*{
 display:block;}
ul#css3menuu li:hover{
 position:relative;}
ul#css3menuu ul .submenu{
 position:absolute;left:100%;top:-1px;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;}
ul#css3menuu{
 padding:5px 5px 5px 0;display:block;font-size:0;float:left;}
ul#css3menuu ul{
 padding:0 5px 5px;}
ul#css3menuu .column{
 float:left;}
ul#css3menuu li{
 display:block;white-space:nowrap;font-size:0;float:left;margin:5px 0 0;}
ul#css3menuu>li,ul#css3menu li{
 margin:0 0 0 5px;}
ul#css3menuu ul>li{
 margin:5px 0 0;}
ul#css3menuu a:active, ul#css3menuu a:focus{
 outline-style:none;}
ul#css3menuu a{
 display:block;vertical-align:middle;text-align:left;text-decoration:none;font:13px "Avenir 85 Heavy",Arial,Helvetica,sans-serif;color:#FFFFFF;text-shadow:#1E4460 0px -1px 1px;cursor:pointer;padding:16px;background-color:#3D3E3F; background-image:-moz-linear-gradient(50% 0%,rgba(255,255,255,0),rgba(0,0,0,0.03));background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(255,255,255,0)),to(rgba(0,0,0,0.03)));background-repeat:repeat;background-position:0 0;border-width:1px;border-style:solid;border-color:#3D3E3F;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#00FFFFFF,endColorstr=#08000000)}
ul#css3menuu ul li{
 float:none;margin:5px 0 0;}
ul#css3menuu ul a{
 text-align:left;padding:7px;background-color:#429ADB; background-image:-moz-linear-gradient(50% 0%,rgba(84,162,218,1),rgba(65,151,214,0));background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(84,162,218,1)),to(rgba(65,151,214,0)));background-position:0 0;border-width:1px;border-style:solid;border-color:#7BB8E6 #357BAF #357BAF #7BB8E6;font:13px "Avenir 85 Heavy",Arial,Helvetica,sans-serif;color:#FFFFFF;text-decoration:none;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#FF54A2DA,endColorstr=#004197D6)}
ul#css3menuu li:hover>a{
 background-color:#429ADB;border-color:#86BEE8 #5EA9E0 #3D3E3F #5EA9E0;border-style:solid;font:13px "Avenir 85 Heavy",Arial,Helvetica,sans-serif;color:#FFFFFF;text-decoration:none;text-shadow:#1E4460 0px -1px 1px; background-image:-moz-linear-gradient(50% 0%,rgba(112,179,228,1),rgba(66,154,219,0));background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(112,179,228,1)),to(rgba(66,154,219,0)));background-position:0 100%;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#FF70B3E4,endColorstr=#00429ADB)}
ul#css3menuu img{
 border:none;vertical-align:middle;margin-right:16px;}
ul#css3menuu img.over{
 display:none;}
ul#css3menuu li:hover > a img.def{
 display:none;}
ul#css3menuu li:hover > a img.over{
 display:inline;}
ul#css3menuu span{
 display:block;overflow:visible;background-position:right center;background-repeat:no-repeat;padding-right:0px;}
ul#css3menuu ul span{
 background-image:url("arrowsub.png");padding-right:40px;}
ul#css3menuu ul li:hover>a{
 background-color:#3983BB; background-image:-moz-linear-gradient(50% 0%,rgba(63,146,208,1),rgba(57,131,187,0));background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(63,146,208,1)),to(rgba(57,131,187,0)));background-position:0 100%;border-style:solid;border-color:#357BAF #7BB8E6 #7BB8E6 #357BAF;font:13px "Avenir 85 Heavy",Arial,Helvetica,sans-serif;color:#FFFFFF;text-decoration:none;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#FF3F92D0,endColorstr=#003983BB)}
ul#css3menuu li.topmenu>a{
 height:14px;line-height:14px;}
ul#css3menuu li.topmenu:hover>a{
 line-height:14px;}
 
 
 
 
 
 </style>

Envoyer par e-mail BlogThis!Partager sur X Partager sur Facebook Partager sur Pinterest

Article plus récent Article plus ancien Accueil

S’abonner à

Articles

Articles

Commentaires

Commentaires

Libellés pour le moment

Menu Dhtml horizontal (1)
Menu Dhtml vertical (1)
Menu Html css horizontal (11)
Menu Html css script vertical (1)
Menu html css vertical (5)

Pages

Accueil

haut de la page