O tutorial de hoje é bem simples, mas quando se quer fazer um layout perfeito, qualquer detalhe faz a diferença não é? Irei ensinar como personalizar aquela caixa de código bem pequena que usamos para por o código do banner de link-me. O nome "formal" dela é text area, e personalizá-la é bem simples. Veja como fica:
Código
<p align="center"><img src="URL_DO_BANNER"/><br />
<textarea onfocus=this.select() onmouseover=this.focus() rows="3" cols="10" name="textarea" style="font-family: verdana; font-size:10px; color: #000; border:1px solid #000; background-color:#fff; width: 120px;">
<a href="LINK_DO_SEU_BLOG" target="_blank"><img src="URL_DO_BANNER" border="0" /></a>
</textarea>
</p>
<textarea onfocus=this.select() onmouseover=this.focus() rows="3" cols="10" name="textarea" style="font-family: verdana; font-size:10px; color: #000; border:1px solid #000; background-color:#fff; width: 120px;">
<a href="LINK_DO_SEU_BLOG" target="_blank"><img src="URL_DO_BANNER" border="0" /></a>
</textarea>
</p>
Você só precisa colocar a url do seu banner de link-me e o link do seu blog nos lugares indicados, e alterar a fonte, cor de fundo e etc. nas partes que estão em cinza. Para quem não sabe, aqui a explicação de cada código:
Font-family: O tipo de fonte da letra (Ex: Arial, Calibri, Georgia)
Font-size: tamanho da fonte
Color: Cor do texto
Border: Estilo da borda você pode mudar o tamanho, a cor e o tipo de borda.
Background: Cor de fundo da caixa
Width: Largura em pixels da sua caixinha
Nenhum comentário:
Postar um comentário