asculta virgin radio

Distribuiţi | 

Simple shadow menu

 Scris de Lcnn la data de Vin Ian 22, 2016 12:31 am

Salut sunt mr.franta si astazi v-am pregatit un meniu simplu si foarte atragator,asta fiind parerea mea cel putin.
Dificultatea acestui meniu este foarte redusa pot sa spun ca este chiar simplu.
previzualizare live http://frannnta-design.hitforum.ro/h44-meniu-simplu-css

Previzualizare 2 (atentie aceasta previzualiare este doar demo fara coduri)
http://frannnta-design.hitforum.ro/h53-rainbowmenu
Daca acest meniu va place,apasati pe butonul din partea dreapta

Uitati si codul

Cod:

<!DOCTYPE html>
<html>
<head>
<style>
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a
{
display:block;
width:90px;
background-color: #dddddd;
box-shadow: 0px 0px 1px black;
}


div.orizontal a:link, div.orizontal a:visited {
font-weight: bold;
font-size: 12px;
font-family: tahoma;
color: #333;
text-align: center;
padding: 4px;
text-decoration: none;
border-top: 1px solid #d2d2d2;

border-bottom: 3px solid #B72801;
box-shadow: 0px 0px 15px black;

background: rgb(252,255,244); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(252,255,244,1) 0%, rgba(233,233,206,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(252,255,244,1)), color-stop(100%,rgba(233,233,206,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#e9e9ce',GradientType=0 ); /* IE6-9 */


}


div.orizontal a:hover{
background: rgb(181,76,50); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(181,76,50,1) 0%, rgba(183,40,1,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(181,76,50,1)), color-stop(100%,rgba(183,40,1,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b54c32', endColorstr='#b72801',GradientType=0 ); /* IE6-9 */

border-bottom: 3px solid brown;
text-shadow: 0px 0px 7px white;
color: white;
}

div.orizontal a.hover{
background: rgb(181,76,50); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(181,76,50,1) 0%, rgba(183,40,1,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(181,76,50,1)), color-stop(100%,rgba(183,40,1,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(181,76,50,1) 0%,rgba(183,40,1,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b54c32', endColorstr='#b72801',GradientType=0 ); /* IE6-9 */

text-shadow: 0px 0px 7px white;
color: white;
</style>
</head>

<body>
<div class="orizontal">

<ul>
<li><a href="#">Link</a></li>
<li><a class="hover" href="#">Acasa</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
<li><a href="#">Link4</a></li>
<li><a href="#">Link5</a></li>
</ul>
</div>


</body>
</html>


Meniu 2 optiminzat pt fg

html

Cod:
<div class="menu">
 
 <ul>
 <li>
 <a href="#" class="verde">verde</a>
 </li>
 <li>
 <a href="#" class="rosu">rosu</a>
 </li>
 <li>
 <a href="#" class="roz">roz</a>
 </li>
 <li>
 <a href="#" class="alb">alb</a>
 </li>
 <li>
 <a href="#" class="portocaliu">portocaliu</a>
 </li>
 <li>
 <a href="#" class="mov">mov</a>
 </li>
 </ul>
</div>
 <br />




css


Cod:





div.menu ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}


div.menu li
{
float:left;
margin-left: 5px;
padding: 2px;
}



div.menu a
{
padding-top: 4px;
border: 1px solid #c9c9c9;
display:block;
width:80px;
background-color:#dddddd;
  color: #EDEDED;
  text-decoration: none!important;
  text-align: center;
  text-transform: italic;
  font-weight: 600;
  font-size: 12px;
  font-family: tahoma;
min-height: 22px;
  box-shadow: 0px 0px 2px white inset;

  text-shadow: 0px 0px 2px black;
}

div.menu a:link{
background: gray}


div.menu a.verde{
  background: rgb(143,200,0); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(143,200,0,1) 0%, rgba(143,200,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(143,200,0,1)), color-stop(100%,rgba(143,200,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc800', endColorstr='#8fc800',GradientType=0 ); /* IE6-9 */;

  }
  
  div.menu a.rosu{
  background: rgb(255,26,0); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,26,0,1) 0%, rgba(255,26,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,26,0,1)), color-stop(100%,rgba(255,26,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff1a00', endColorstr='#ff1a00',GradientType=0 ); /* IE6-9 */
}
  
    div.menu a.alb{
background: rgb(254,255,232); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(254,255,232,1) 0%, rgba(214,219,191,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,255,232,1)), color-stop(100%,rgba(214,219,191,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffe8', endColorstr='#d6dbbf',GradientType=0 ); /* IE6-9 */
 color: #222;
  text-shadow: 0px 1px 2px white;}
  
  
      div.menu a.roz{background: rgb(255,0,132); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,0,132,1) 0%, rgba(255,0,132,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,0,132,1)), color-stop(100%,rgba(255,0,132,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0084', endColorstr='#ff0084',GradientType=0 ); /* IE6-9 */
}
  
  
  div.menu a.portocaliu{
  background: rgb(255,168,76); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,168,76,1) 0%, rgba(255,123,13,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,168,76,1)), color-stop(100%,rgba(255,123,13,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d',GradientType=0 ); /* IE6-9 */
}
  
  
  div.menu a.mov{
background: rgb(229,112,231); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(229,112,231,1) 0%, rgba(200,94,199,1) 47%, rgba(168,73,163,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(229,112,231,1)), color-stop(47%,rgba(200,94,199,1)), color-stop(100%,rgba(168,73,163,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e570e7', endColorstr='#a849a3',GradientType=0 ); /* IE6-9 */
}
  
  
  
  div.menu a.alb:hover{
  background: rgb(233,233,206); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(233,233,206,1) 0%, rgba(252,255,244,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(233,233,206,1)), color-stop(100%,rgba(252,255,244,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9ce', endColorstr='#fcfff4',GradientType=0 ); /* IE6-9 */

  }
    div.menu a.verde:hover{background: rgb(182,224,38); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(182,224,38,1) 0%, rgba(118,221,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(182,224,38,1)), color-stop(100%,rgba(118,221,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(182,224,38,1) 0%,rgba(118,221,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(182,224,38,1) 0%,rgba(118,221,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(182,224,38,1) 0%,rgba(118,221,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(182,224,38,1) 0%,rgba(118,221,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b6e026', endColorstr='#76dd00',GradientType=0 ); /* IE6-9 */

  }
    div.menu a.rosu:hover{
  background: rgb(169,3,41); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(169,3,41,1)), color-stop(44%,rgba(143,2,34,1)), color-stop(100%,rgba(109,0,25,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */

  }
    div.menu a.portocaliu:hover{
  background: rgb(255,103,15); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,103,15,1) 0%, rgba(255,93,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,103,15,1)), color-stop(100%,rgba(255,93,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,103,15,1) 0%,rgba(255,93,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,103,15,1) 0%,rgba(255,93,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,103,15,1) 0%,rgba(255,93,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,103,15,1) 0%,rgba(255,93,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff670f', endColorstr='#ff5d00',GradientType=0 ); /* IE6-9 */

  }
    div.menu a.roz:hover{
background: rgb(251,131,250); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(251,131,250,1) 0%, rgba(231,126,234,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(251,131,250,1)), color-stop(100%,rgba(231,126,234,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(251,131,250,1) 0%,rgba(231,126,234,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(251,131,250,1) 0%,rgba(231,126,234,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(251,131,250,1) 0%,rgba(231,126,234,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(251,131,250,1) 0%,rgba(231,126,234,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fb83fa', endColorstr='#e77eea',GradientType=0 ); /* IE6-9 */
  }
  
  
  div.menu a.mov:hover{
  background: rgb(169,87,214); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(169,87,214,1) 0%, rgba(142,41,196,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(169,87,214,1)), color-stop(100%,rgba(142,41,196,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(169,87,214,1) 0%,rgba(142,41,196,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(169,87,214,1) 0%,rgba(142,41,196,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(169,87,214,1) 0%,rgba(142,41,196,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(169,87,214,1) 0%,rgba(142,41,196,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a957d6', endColorstr='#8e29c4',GradientType=0 ); /* IE6-9 */

  }
  





meniu 3 html

Cod:



 
<div class="menu2">
 
 <ul>
 <li>
 <a href="#" class="verde2">verde</a>
 </li>
 <li>
 <a href="#" class="rosu2">rosu</a>
 </li>
 <li>
 <a href="#" class="roz2">roz</a>
 </li>
 <li>
 <a href="#" class="alb2">alb</a>
 </li>
 <li>
 <a href="#" class="portocaliu2">portocaliu</a>
 </li>
 <li>
 <a href="#" class="mov2">mov</a>
 </li>
 </ul>
</div>



meniu 3 css

Cod:



div.menu2 ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
background: rgb(233,233,206); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(233,233,206,1) 0%, rgba(252,255,244,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(233,233,206,1)), color-stop(100%,rgba(252,255,244,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(233,233,206,1) 0%,rgba(252,255,244,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9ce', endColorstr='#fcfff4',GradientType=0 ); /* IE6-9 */

border: 3px solid #f4f4f4;
border-radius: 5px;
width: 550px;
box-shadow: 0px 0px 2px #bbb;
}


div.menu2 li
{
float:left;
margin-left: 5px;
padding: 2px;
}


div.menu2 a
{
padding-top: 4px;
border: 1px solid #c9c9c9;
display:block;
width:80px;
background-color:#dddddd;
  color: #EDEDED;
  text-decoration: none!important;
  text-align: center;
  text-transform: italic;
  font-weight: 600;
  font-size: 12px;
  font-family: tahoma;
min-height: 22px;
  box-shadow: 0px 0px 2px white inset;
border-radius: 5px;
  text-shadow: 0px 0px 2px white;
}

div.menu2 a:link{
background: gray}



  
  div.menu2 a.roz2,div.menu2 a.alb2,div.menu2 a.rosu2,div.menu2 a.verde2,div.menu2 a.mov2,div.menu2 a.portocaliu2{
  background: rgb(252,255,244); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(252,255,244,1) 0%, rgba(233,233,206,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(252,255,244,1)), color-stop(100%,rgba(233,233,206,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(252,255,244,1) 0%,rgba(233,233,206,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#e9e9ce',GradientType=0 ); /* IE6-9 */
padding-top: 4px;}
  
  
  div.menu2 a.verde2:hover{
  background: rgb(143,200,0); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(143,200,0,1) 0%, rgba(143,200,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(143,200,0,1)), color-stop(100%,rgba(143,200,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(143,200,0,1) 0%,rgba(143,200,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc800', endColorstr='#8fc800',GradientType=0 ); /* IE6-9 */;
color: black;
border: 1px solid green;
  }
  
  div.menu2 a.rosu2:hover{
  background: rgb(255,26,0); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,26,0,1) 0%, rgba(255,26,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,26,0,1)), color-stop(100%,rgba(255,26,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,26,0,1) 0%,rgba(255,26,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff1a00', endColorstr='#ff1a00',GradientType=0 ); /* IE6-9 */
}
  
    div.menu2 a.alb2:hover{
background: rgb(254,255,232); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(254,255,232,1) 0%, rgba(214,219,191,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,255,232,1)), color-stop(100%,rgba(214,219,191,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffe8', endColorstr='#d6dbbf',GradientType=0 ); /* IE6-9 */
 color: #222;
  text-shadow: 0px 1px 2px white;}
  
  
      div.menu2 a.roz2:hover{background: rgb(255,0,132); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,0,132,1) 0%, rgba(255,0,132,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,0,132,1)), color-stop(100%,rgba(255,0,132,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,0,132,1) 0%,rgba(255,0,132,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0084', endColorstr='#ff0084',GradientType=0 ); /* IE6-9 */
}
  
  
  div.menu2 a.portocaliu2:hover{
  background: rgb(255,168,76); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,168,76,1) 0%, rgba(255,123,13,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,168,76,1)), color-stop(100%,rgba(255,123,13,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,168,76,1) 0%,rgba(255,123,13,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d',GradientType=0 ); /* IE6-9 */
}
  
  
  div.menu2 a.mov2:hover{
background: rgb(229,112,231); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(229,112,231,1) 0%, rgba(200,94,199,1) 47%, rgba(168,73,163,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(229,112,231,1)), color-stop(47%,rgba(200,94,199,1)), color-stop(100%,rgba(168,73,163,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(229,112,231,1) 0%,rgba(200,94,199,1) 47%,rgba(168,73,163,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e570e7', endColorstr='#a849a3',GradientType=0 ); /* IE6-9 */
}
 
  div.menu2 a.verde2{
  color: green;}
  
  
    div.menu2 a.rosu2{
  color: #C91013;}
  
      div.menu2 a.portocaliu2{
  color: #FF8800;}
  
      div.menu2 a.roz2{
  color: #FF00F6;}
  
      div.menu2 a.mov2{
  color: #9B00D3;}
  
  ----------------------
  div.menu2 a.verde2:hover{
  color: black!important;
border: 1px solid green;}
  
  
    div.menu2 a.rosu2:hover{
 color: #111;
border: 1px solid darkred;}
  
      div.menu2 a.portocaliu2:hover{
 color: #111;
border: 1px solid #8F4304}
  
      div.menu2 a.roz2:hover{
 color: #111;
border: 1px solid #AA3F96;}
  
      div.menu2 a.mov2:hover{
 color: #111;
border: 1px solid #5A2F65;}


div.menu2 a.alb2{
color: black;}

Offline
avatar
Lcnn
Administrator

Mesaje : 321
Varsta : 25
Localizare : Timisoara

Vezi profilul utilizatorului http://phpbb2.phpdevil.com
Pagina 1 din 1

Permisiunile acestui forum:Nu puteti raspunde la subiectele acestui forum
phpbb2.phpdevil.com :: PHPDEVIL # Web-design :: Tutoriale HTML/CSS-
Mergi direct la:  

pHpDeviL | For the love of the game...