sexta-feira, 22 de outubro de 2010

Menu em abas

image

Menu em aba bem simples e fácil de instalar.

Copie o código abaixo, vá em “Elementos da página” – “Adicionar um Gadget” – “HTML/Javascript” e cole o código.

<style type="text/css">
    div.TabTampil div.TTs
    {height: 24px; overflow: hidden; }
    div.TabTampil div.TTs a:hover, div.TabTampil div.TTs a.Active
    { background-color: #77d0ee; }
    div.TabTampil div.Halamans
    { clear: both; border: 1px solid #0199cb; overflow: hidden; background-color: #ffffff;}
    div.TabTampil div.Halamans div.Halaman
    { height: 100%; padding: 0px; overflow: hidden; }
    div.TabTampil div.Halamans div.Halaman div.Alas
    { padding: 3px 5px; }
    div.TabTampil div.TTs a
    { border-left:1px solid #0199cb; border-right:1px solid #0199cb; border-top:1px solid #0199cb;  float: left;
    display: block; width: 100px; text-align: center; height: 24px; padding-top: 3px; vertical-align: middle; text-decoration: none; font-family: "Arial", Serif;
    font-size: 12px; font-weight: 900; color: #222}
    </style>
<form action="tabtampil.html" method="get">
    <div id="TabTampil" class="TabTampil">
    <div style="width: 370px;" class="TTs">
<a>Aba 1</a>
<a>Aba 2</a>
<a>Aba 3</a>
</div>
    <div style="width: 350px; height: 300px;" class="Halamans">
   <div class="Halaman">
    <div class="Alas">
CÓDIGO DA ABA 1
    </div>
    </div>
    <div class="Halaman">
    <div class="Alas">
CÓDIGO DA Aba 2
    </div>
    </div>
    <div class="Halaman">
    <div class="Alas">
CÓDIGO DA ABA 3
    </div>
    </div>
    </div>
    </div></form>
  <script style="text/javascript" src="http://meichelina.googlepages.com/newscriptab.js"></script> <script type="text/javascript">tabtampil_inisial('TabTampil');</script>

Na parte vermelha é o título da aba

Na parte azul é o conteúdo da aba, você pode inserir código HTML, textos, imagens….

Na parte verde é a largura da tabela.

Feitas as modificações, salve!

Marcadores: ,

Blogger de cara nova!

imagePra quem entrou na página do Blogger.com para fazer o login, percebeu que foram feitas novas mudanças.O blogger agora ficou mais moderno, com um visual mais leve e bonito!

Sua página inicial exibe algumas de suas novidades como a estatísticas em tempo real, novos templates modernos, e o editor de Templates.

image

Marcadores: , ,

Favicon no blog (atualizado pro chrome)

imagePostamos aqui no Códigos Blogger  um tutorial de como colocar favicon no blogger, mas apenas funcional para o IE e Firefox. Nesse tutorial, irei ensinar como fazer com que o favicon também funcione para o chrome.Na verdade, é outro código de favicon próprio para o chrome.

Faça o seguinte..

Vá no ‘Editar HTML’ no seu blog e cole o seguinte código abaixo da tag <body>.

<link href='URL DO FAVICON' rel='shortcut icon' type='image/vnd.microsoft.icon'/>
<link href='URL DO FAVICON' rel='icon'/>

Depois substitua a parte destacada de vermelho pela URL do seu favicon.Lembrando que o tamanho do favicon tem que ser 16x16 para um melhor funcionamento e no formato .ico ou .png.

Depois salve!

Marcadores: ,