Downloads Tutoriais   Adicionar a favoritos Contato


» CSS


Celso Garcia - fundador do Web Nets, estuda e trabalha com Web há 3 anos. Atualmente cursa Ciência da Computação e é formado no curso técnico de Web Design. Trabalhou já no Departamento de Internet da Universidade e empresas de desenvolvimento de CMS e intranets.

Propriedade Fonte: estudo das cores, estilos, tamanhos e variedades - (8/8/2008)


A Propriedade Fonte do CSS é sem dúvida uma das mais importantes, pois nela podemos deixar o texto com a formatação que melhor nos aguarde. Vamos estudá-las:



Fonte:

color: cor da fonte;

font-family: família de fonte;

font-size: tamanho da fonte;

font-style: estilo da fonte;

font-variant: fontes minúsculas com menor altura;

font-weight: a fonte fica mais escura;

font: jeito abreviado para todas as fontes;




Cores (color):

código hexadecimal: #000000 / #FFFFFF;

código rgb: rgb(255,235,0);

nome da cor: yellow / green / red;




Família da fonte (font-family):

font-family: verdana,arial black,arial (ela obedecerá a essa ordem e a primeira fonte que encontrar é que ela aplicará);




Tamanho da fonte (font-size):

font-size: 10px / 20px (Pixels é uma unidade de medida para o tamanho da letra, quanto menor o valor, menor será a letra, e quanto maior o valor, maior será a letra);




Estilo da fonte (font-style):

font-style: normal;

font-style: oblique;

font-style: italic;




Variação da fonte (font-variant):

font-variant: normal;

font-variant: small-caps (Transforma em maiúsculas de menor altura);




Peso da fonte (font-weight):

font-weight: normal;

font-weight: bold;

font-weight: bolder;

font-weight: lighter;

font-weight: 100;

font-weight: 200;

font-weight: 300;

font-weight: 400;

font-weight: 500;

font-weight: 600;

font-weight: 700;

font-weight: 800;

font-weight: 900;




Outros:

font: caption (Fontes usadas em botão);

font: icon (Fontes usadas em ícones);

font: menu (Fontes usadas em menus);

font: message-box (Fontes usadas em caixas de mensagens);

font: small-caption (Fontes usadas em pequenos controles);

font: status-bar (Fontes usadas em barras de status);



Exportar para Word Exportar para Word Enviar página para amigo Enviar para amigo Imprimir página Imprimir



Todos os tutoriais



© 2010 Web Nets - Todos os direitos reservados