quinta-feira, maio 26, 2005

Como alterar a cor do texto?! E o tipo de letra?! E o tamanho?!

Mais uma vez a resposta para esta questão não é imediata. Se queremos alterar uma parte de texto de um post é uma coisa. Se queremos fazer uma alteração a título definitivo em alguma área do blog é outra. E porquê?

Porque na primeira, basta a introdução de código no post em questão e ficamos com o assunto resolvido; para a segunda temos de alterar o template e isso já não é imediato.

Vamos então ver o primeiro caso: Alterar a letra num post!

A forma mais fácil de fazer este tipo de alteração é usando o objecto FONT
<FONT COLOR="blue" SIZE="2" FACE="Arial"> texto que queremos alterar <FONT>

Vamos então conhecer melhor os seus atributos (só vou indicar os mais importantes):


  • COLOR - permite escolher a cor do texto. Aceita dois tipos de valores, ou o nome da cor (white, black, blue, etc...) ou o código RGB da cor que querem. Já explico mais à frente o que é o código RGB. (lista com 216 nomes de cores e códigos RGB seguros, ie, sempre reconhecidos pelos browsers)

    color="Deepskyblue":   Este texto é um teste!

  • SIZE - tamanho da fonte de 1 a 7

    size="5":   Este texto é um teste!

  • FACE - nome do tipo de letra (ou tipos) que queremos utilizar. O nome do tipo de letra é por exemplo Arial, Times New Roman, Comic Sans MS, etc. Podem consultar no Word os tipos de letra existentes no vosso pc. Conselho: Utilizem tipos de letra comuns, porque correm o risco ao usar tipos de letra mais personalizados de haver utilizadores que não os tenham e por consequinte não vejam a vossa página em condições. Para evitar isso, podem indicar mais do que um tipo de letra separado por virgulas:

    face="Courier New, Arial, Times New Roman":   Este texto é um teste!

  • STYLE - permite utilizar códigos de CSS para definir o tipo de letra (mais seguro mas mais complicado)

  • CLASS - indica qual a classe de CSS que o texto dentro deste objecto deve respeitar (novamente é o mais correcto no entanto mais complicado)



Exemplo final:

O código:


<font color="Deepskyblue" size="4" face="Comic Sans MS, Verdana, Arial">Este texto é um teste!</font>


O resultado:

Este texto é um teste!

Ficamos então com a alteração do texto no template por explicar.

Então e porque é que este caso é mais dificil de explicar?! Porque os templates recorrem ao uso de CSS (Cascading Style Sheets). No ínicio do vosso template vão encontrar uma zona do código delimitada pelos seguintes "marcadores":

<style type="text/css">
...
</style>


É aqui dentro que se vai definir qual o aspecto de cada área do blog (posts, comentários, lista de links, arquivos, etc.). Dentro desta área vão estar definidas várias classes as quais vão ser chamadas pelos objectos de HTML pelo atributo CLASS, e as definições base para os principais objectos de HTML.

Como é muito complicado explicar-vos assim desta forma como alterar, o que vos aconselho é darem uma olhadela no vosso template e se vos interessar "cuscar" esta zona de código, pesquisando depois no resto do template onde é que são chamadas. Podem obter mais explicações sobre CSS em Guide to Cascading Style Sheets.

Mais dúvidas já sabem!

Sem comentários: