Este tutorial vai te ensinar a deixar o menu do jeito que esta na foto. É necessário apagar todos os códigos antigos antes de adicionar os novos.
ps: como assim apagar os códigos antigos? R: o seu layout veio com um menu certo? então apague o código que pertence a ele, ou seja, apague o código do menu atual para colocar o novo :)
Muitas vezes o CSS esta 'escondido' dentro do template, caso esteja basta clicar em ►<b:skin>...</b:skin> para que você possa visualizar CSS e editar.
no css:
/* --- Menu -------- */
.widget-content { width:100%}
#PageList1 {background: #; width: 100%;height: 44px; line-height:20px; margin-bottom: 38px; border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; text-transform:uppercase; }
#PageList1 ul li a {font-family: 'Open Sans Condensed', sans-serif; color:#737373; text-decoration: none;
font-size: 24px; padding: 05px; font-weight: 300; -webkit-transition-duration: .50s;-moz-transition: 50s; -o-transition: 50s;}
#PageList1 ul li a:hover {color:#9f9f9f;text-decoration: none;}
/* --- Fim do Menu -------- */
Para posicionar o menu antes das postagens encontre a tag '<body>' e procure por ''<div id='content-wrapper'>" e logo depois dessa linha cole este código (click no link).
Personalizando o menu:
border (bottom / top) - linha do menu;
font-family - tipo da fonte;
font-weight - normal, bold, bolder, lighter, 100, 200, 300, 400;
font-style - estilo da font, suas variações são oblique, initial, inherit.
text-transform: uppercase - texto maiúsculo, suas variações: none: texto normal, capitalize: todas as primeiras letras do texto em maiúsculas, lowercase: todas as letras do texto em minúsculas ;
#PageList1 ul li a - cor do link, tipo de fonte, tamanho, padding (espassamento);
#PageList1 ul li a:hover - cor do link quando clicar;
#PageList1 - width (tamanho total do menu), height (altura do menu), aqui você pode adicionar cor no fundo em 'background'.
Fonte que utilizei: <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'/>
Nenhum comentário :
Postar um comentário