Olá! Seja bem-vindo ao meu blog!

Aqui você dá as boas vindas aos seus leitores, fala sobre você e seu blog, contato:

E aqui você deixa os links de suas redes sociais, com ícones de sua preferência:

Menu

Faça um tour pelo blog ;3

TUTORIAL-Menu feito por MIN!



Garota do século
Olá gente!
Tô tão feliz que Hoje fiz um menu! eu disponibilizei pra vocês espero que gostem:



Gostou? rs é um começo :) Bem,você pode Modifica-ló como quiser,abaixo o CSS

#cssmenu ul, #cssmenu li,
#cssmenu span, #cssmenu a { margin: 0; padding: 0; }
#cssmenu {
background: #FF1493;
border-bottom: 1px solid #aa9961;
box-shadow: inset 0 2px 4px rgba(151, 129, 82, 0.5);
-moz-box-shadow: inset 0 2px 4px rgba(151, 129, 82, 0.5);
-webkit-box-shadow: inset 0 2px 4px rgba(151, 129, 82, 0.5);
}
#cssmenu:after { content:''; display: block; clear: both; }
#cssmenu a {
display: inline-block;
font-family: Calibri, Arial, sans-serif;
color: #131210; text-decoration: none;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-o-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
}
#cssmenu a:hover { background: #aa9961; }
#cssmenu ul {
list-style: none;
height: 34px;
padding: 10px 0;
}
#cssmenu > ul > li {
float: left;
height: 34px;
margin: 0 5px;
position: relative;
}
#cssmenu > ul > li > a {
background: #978152;
box-shadow: inset 1px 1px 3px rgba(19,18,16,0.2);
-moz-box-shadow: inset 1px 1px 3px rgba(19,18,16,0.2);
-webkit-box-shadow: inset 1px 1px 3px rgba(19,18,16,0.2);
border-radius: 17px;
-moz-border-radius: 17px; -webkit-border-radius: 17px;
line-height: 24px;
padding: 5px 10px;
}
#cssmenu > ul > li.active a {
background: #131210;
color: #f8f5ee;
}
#cssmenu .has-sub ul {
background: #f8f5ee;
border: 1px solid #aa9961;
border-top: 0 none;
height: 0; overflow: hidden;
padding: 0; position: absolute;
opacity: 0; top: 44px; left: 0;
width: 160px;
-webkit-transition: opacity 0.2s;
-moz-transition: opacity 0.2s;
-o-transition: opacity 0.2s;
-ms-transition: opacity 0.2s;
transition: opacity 0.2s;
}
#cssmenu .has-sub:after {
content: '';
display: block;
padding: 0 10px;
position: absolute;
bottom: -10px; left: 0;
height: 10px; width: 200%;
}
#cssmenu .has-sub:hover ul {
border-radius: 0 0 5px 5px;
-moz-border-radius: 0 0 5px 5px;
-webkit-border-radius: 0 0 5px 5px;
height: auto;
opacity: 1;
padding: 10px;
}
#cssmenu .has-sub li,
#cssmenu .has-sub li a { padding: 0 5px; width: 100%; }
#cssmenu .has-sub li { margin: 8px 0; }
#cssmenu .has-sub li a {
border-radius: 5px 0 0 5px;
-moz-border-radius: 5px 0 0 5px;
-webkit-border-radius: 5px 0 0 5px;
line-height: 120%;
}
Os que estão de vermelho são backgrouds isto é,a cor que deseja
Os que estão de  Amarelo é a distância de cada link
Os que estão de Azul  é a altura de cada link
Os que estão de Verde são as bordas,se deseja coloca-lás basta preencher estas partes,se não quiser,no lugar dos números coloque o zero (0).
Os que estão de Azul clarinho do lado,você coloca o link da página

LEMBRANDO QUE ESSE E MEU PRIMEIRO MENU, não sei se vai ficar bom,ou vai aparecer... :(


2 comentários:

  1. desculpa so o mesmo dai de cimae vi que o que tava fazenu nao e legal desculpa

    ResponderExcluir

Olá pessoal,bem vindos!
bem,aqui é onde você comenta e troca opiniões com nosco;
estou muito feliz por estarem comentando akiie ;)
por favor seja educado (a)

Kisses ;*

Brightness Girl Copyright 2013. Editado por: Roberta. Créditos dos recursos utilizados em: Reino Kawaii.
up