Barra Liviana de Menu De Navegacion AZUL

News Tickers

Search



jueves, 4 de julio de 2013

Barra de navegacion glossy para blogger

Pon este codigo de css en plantilla busca este codio ]]</b:skin> y arriba de este pega el siguiente codigo.


/* El Codigo de CSS para el menu empieza aqui ciudadblogger.info */
.cbg_glossymenu1{
 position: relative;padding: 0 0 0 34px;margin: 0 auto 0 auto;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPoGpzHc7KR0Cy_4niuNWwznI7rXjxLulRRcYlTcsWtrYQARI1Q9JpE78Im3OX6HSziJnAf9pz15115puZnv8dk2UrLTmp-lc79b6t3GEvXqZXRCKjnqAeyIYcPUR3W8PDPAvZi_7jbR0/s1600/btrix_menupu_bg.gif) repeat-x;
 height: 46px;
 list-style: none;
}
.cbg_glossymenu1 li{
 float:left;
}
.cbg_glossymenu1 li a{
 float: left;display: block;color:#000;
 text-decoration: none;
 font-family: sans-serif;
 font-size: 13px;
 font-weight: bold;
 padding:0 0 0 16px;
 height: 46px;
 line-height: 46px;
 text-align: center;
 cursor: pointer;
}
.cbg_glossymenu1 li a b{
 float: left;display: block;padding: 0 24px 0 8px;
}
.cbg_glossymenu1 li.current a, .cbg_glossymenu1 li a:hover{
 color: #fff;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3cNqQITnE4oymFWENa9yvH9m9jPwjf4a_ASwt6MWzJyYGTMrxJGrDymvuCcLb3E6A1hLDEICUO0MB7ULOz3RpxtbgxRzWLJMxEzO16YupuweLtycCgRM82FzRb1eGwubXveL0GBPMs5Y/s1600/btrix_menupu_hover_left.gif) no-repeat;
 background-position: left;
}
.cbg_glossymenu1 li.current a b, .cbg_glossymenu1 li a:hover b{
 color: #fff;
 background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjNU0-hR86e2ju1G-jPzfHEoTaorhgIuRlDY6kSf7smuntfS69VqWSma7rRIciPxny39BP9UQ81Ag-VttOpf-eTgE25vq6Tt5ZBQVq7hPh3LmH0oJ7OnVGIUP7gX-Q3JXrmJMEF2JU4dc/s1600/btrix_menupu_hover_right.gif) no-repeat right top;
}

Luego en Diseno >> Anade un gadget >>>Selecciona Html.Javascript y pega el siguiente codigo
 <ul class="cbg_glossymenu1">
 <li class="current"><a href="#"><b>Pagina Principal</b></a></li>
 <li><a href="#"><b>CSS</b></a></li>
 <li><a href="#"><b>Foros</b></a></li>
 <li><a href="#"><b>Herramientas</b></a></li>
 <li><a href="#"><b>JavaScript</b></a></li>
 <li><a href="#"><b>Contactenoss</b></a></li>
</ul>

 Ver ejemplo barra de navegacion co brillo:

No hay comentarios. :

Publicar un comentario

Social Media Compartida Animada

  • Como Anadir Widget Cubo Hielo 3D Media Social A Tu Blog

    Esta vez traigo un widget que les encantara su diseno y atractivo y util en forma de bloque de hielo en 3D.

  • Coleccion Excelente De Tabs JQuery Para Blog De Blogger

    Con jQuery, podemos hacer las cosas mas fáciles que jQuery JavaScript.Esta, se ha convertido en la biblioteca más popular JavaScript en uso ultimos días En este artículo te voy a mostrar una excelente colección de Tabs jQuery que puedes usar para tu sitio web o blogs.Cuando vamos a un sitio web, podemos ver diferentes tipos de Tabs.Si se agrega una ficha o tab de jQuery a su sitio web, se ahorra mucho espacio en su paginas.Ademas le da un aspecto atractivo a tu blog.

  • Anadir Un Share Box Perfecto Para Blog de Blogger

    En este tutorial,te mostrare truco como anadir un share box a tu blog de blogger. Esta caja de compartir contiene boton oficial de Twitter,Facebook,Pinterest , Google Plus,Stmbleupon,Linkedin con contador, Boton de imprimiry boton de like de Facebook.He configurado estos botones para usarse en blog de blogger, para que puedes anadirlo facilmente.

  • Como Anadir/Instalar Google Analysis A Blog De Blogger

    En algunas ocasiones es interesarte chequear tu blog/website en linea por estadisticas de visitantes. Existen miles de herramientas en linea, y sitios web que son de ayuda con este asunto pero uno que es exacto con estadisticas de visitantes es el Google Analytics .

  • Slider Completamente Automatico Para Tu Blog De Blogger

    Les voy a dejar un widget que me encanta. Puedes anadir este slider a tu Barra del lado de tu pagina principal . Solo tienes que hacer una customizacion. Este es completamente automatico solo entraras a la direccion de tu blog y lo anades el slider o deslizador se mantendra actualizando las entrdas tales como Entradas Populares, Etiquetas, Cuadro de Me Gusta etc.