Oii amorecos, tudo bom? O tutorial de hoje é sobre como fazer uma navbar com um estilo NOVO, não é bem novo mas é um jeito mais simples e bonito de se fazer ok? Para saber qual o estilo da navbar basta clicar aqui e ver. Então vamos ao tuto...
Vá no html do seu blog e procure(Ctrl + F) por: <body
ABAIXO dessa LINHA que normalmente é essa: <body expr:class='"loading" + data:blog.mobileClass'> cole o código a seguir:
<div id="nav-tg"></div>Agora procure(Ctrl + F) por: ]]></b:skin>
e ACIMA cole o código a seguir:
#nav-tg{
width: 100%;
height: 50px;
background: url('http://static.tumblr.com/4bage8q/97Xlmqw2h/01.png');
border: 1px none #000;
z-index: 100;
position: fixed;
}
Lilás: Altura da navbar
Vermelho: Link do fundo da navbar
Azul: Borda da navbar
Dúvidas? Comentem! Espero que tenham gostado do tuto e até amanhã... Beijos
Estava procurando como fazia isso. :x HAHAH
ResponderExcluirAdorei, vou ver se da certo. Beijos flor
http://a-crossthestreet.blogspot.com/
oooi fofa!
ResponderExcluirAdorei o blog!
Me segue no twitter (te sigo de volta) pq eu preciso falar ctg: @susanstumm
bjs
Oie! Gostei do seu blog e achei bacana que também conhecesse o meu. Ele engloba bastante coisa, ilustração, música, literatura, moda e coisas que toda mulher adora!
ResponderExcluirSe tiver um tempinho passa lá depois e me diz o que achou, se gostar e se identificar, siga, comente ou divulgue que fico muuuuuuuuuito grata, sua opinião vale muito pra mim viu!
Ahhh lembrando que o blog está com 3 sorteio super legais acontecendo, participa!
Beijos :D http://www.agirlaplanet.com
Hoje,foi a primeira vez que entrei no blog e a primeira coisa que noite foi isso.
ResponderExcluirSuper diferente e inovador, A.D.O.R.E.I!^.^
Bjão amiga . :*
www.caprichospace.com
Nossa amei, meu sonho era saber fazer isso, sério! obrigadaaaa:) haha
ResponderExcluirbeijooo;*
http://www.ilovevoogue.blogspot.com/
Gente, para tudo! Que blog é esse? LINDO *-* Me apaixonei!
ResponderExcluirDesculpa por ter retribuído o comentário agora, é que tô ficando sem tempo pra postar por causa de escola, afins. Mas seu blog é tudo! Inovador, criativo, fofo, parabéens! É óbvio que estou seguindo ;)
Beijãao, Geoô A.
http://closetteen-ct.blogspot.com
Nossa. Adorei o tutorial! Bem mais rápido, eu sou tão tola para achar códigos assim, que o meu ficou beeeeem mais extenso. Beijos.
ResponderExcluirAi que tudo. Estava procurando este tutorial *o*
ResponderExcluirMuito obrigada mesmo *-*
http://garotasederivados.blogspot.com/
se colocar no no lugar de position: fixed colocar moved, ela fica só lá em cima e não desse com a barra de rolagem, pelo menos no meu!
ResponderExcluirmas eu retirei a usebar, e fica um espaço que não consigo tirar(mesmo sem modifica-la como fiz) entre o topo e a nova barra, que seria preenchido pela usebar se ela estivesse lá.
o que faço?
PS.: responde aqui porque meu blog está em reforma!
kissus
Flor, você tirou a navbar? Ou deixou? Tenta colocar:
ResponderExcluir#nav-tg{
display:none;
}
amor eu amei o tutorial mais to com um probleminha, conforme a barrar de rolagem desse, a navbar tbm desse '-'
ResponderExcluirOIIi!!!!Mes egue??to divulgando meu blog e ficaria muito feliz se vc entrassse no meu blog e me seguisse!!!Tbm queria te pedir que faça um tuto de como colocar barrinhas entre as postagens(se ja tiver feito foi maus)beijoks
ResponderExcluirwww.osonhodamoda.blogspot.com