Curso de Adobe PhotoShop

Aprenda usar o programa do Adobe PhotoShop de maneira fácil e rápida, conheça os mais variados efeitos que podem ser criados no PhotoShop. Isso e muito mais você encontra em nosso curso. Acesse: Curso de PhotoShop.

GMDigital

Video-Aulas de qualidade você encontra aqui! Acesse: Video-Aulas .

EquipeGM WebDesigner

EquipeGM WebDesigner Desenvolvimento de Sites e Blogs, Vídeo Aulas e Muito Mais! Nos Visite GMDigital.

Curso de NVU

Esta cansado de pedir favores aos outros para fazer ou concertar seu site. Aqui esta a solução, aprenda criar seu próprio site, de maneira rápida e fácil. Tudo isso e muito mais em nosso Curso de NVU. Acesse: Curso de NVU.

MaguiSilva WebDesigner

Conhecimento é tudo, porém nem tudo é conhecimento!

terça-feira, 27 de setembro de 2011

Adicionando Coluna no Template em HTML


Eae Galera, neste tutorial eu irei ensinar como estarAdicionando Coluna no Template em HTML
Obs : Lembrando que o Tutorial foi feito com Base no Template Minima, Antes de Começar o Tutorial Faça um Backup pra não ter danos nele não me RESPONSABILIZO por DANOS nele

1º Abra a Pagina Editar HTML Procure por:

      <div id='main-wrapper'>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Postagens no blog' type='Blog'/>
</b:section>
      </div> 

2º Cole o Codigo mostrado abaixo, Acima de <div id='main-wrapper'>.

<center><div id='coluna'>
<table width="220" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <th scope="col" background="link da imagem do titulo aqui">&nbsp;</th>
  </tr>
  <tr>
    <td background="link da imagem onde vai ficas as widets"><b:section class='coluna' id='coluna' preferred='yes'></b:section>&nbsp;</td>
  </tr>
  <tr>
    <td background="link da imagem do footer">&nbsp;</td>
  </tr>
</table>
</div></center>

Substitua o Valor Destacado em Azul pela largura total da suas imagem.

 Adicionando o CSS, Procure por ]]></b:skin>.
e Cole o Codigo Abaixo Acim dele.

#coluna {
  width: 220px;
  float: left;
  word-wrap: break-word;
  overflow: hidden;
}

pra mudar a Posição da Coluna Troque Left por Right, Pra altera a largura da Coluna Altere os numero destacado em Azul. Lembrando que pra Caber as Colunas Precisa Almentar o Valor
de width:

  #outer-wrapper {
  width: 660px;
  margin:0 auto;
  padding:10px;
  text-align:$startSide;
  font: $bodyfont;
  }


Comente...

0 comentários:

Postar um comentário

Dentro de 6 horas seu comentário publicado.