O atributo de estilo
O atributo <style> é usado para adicionar características a um elemento, como cor, fonte, tamanho e muitos outros.
Definir estas características ou estilos de um elemento HTML pode ser feito com o atributo <style>.
O atributo de <style> possui a seguinte sintaxe:
<nome da tag style=”propriedade-valor;”>
Vamos usar como exemplo a propriedade cor de fundo.
Propriedade cor de fundo
A propriedade CSS background-color define a cor de fundo de um elemento html.
<body style=”background-color:powderblue;”>
<h1>Este é um título</h1>
<p>Este é um parágrafo</p>
</body>
Podemos também editar a propriedade background-color para outros elementos também:
<body style=”background-color:powderblue;”>
<h1 style=”background-color;tomato;”>Este é um título</h1>
<p style=”background-color:yellow;”>Este é um parágrafo</p>
</body>
Propriedade cor de texto
A propriedade CSS color define a cor do texto para um elemento html:
<h1 style=”color:green;”>Este é um título</h1>
<p style=”color:blue;”>Este é um parágrafo</p>
Elemento font
A propriedade font-family define a fonte a ser usada para um elemento html:
<h1 style=”font-family:courier;”>Este é um título</h1>
<p style=”font-family:verdana;”>Este é um parágrafo</p>
Elemento texto
Tamanho do texto
A propriedade CSS font-size define o tamanho do texto
<h1 style=”font-size:300%;”>Este é um título</h1>
<p style=”font-size:150%;”>Este é um parágrafo</p>:
Alinhamento de texto
A propriedade text-align define o alinhamento horizontal do texto:
<h1 style=”text-align:center;”>Este é um título centralizado</h1>
<p style=”text-align:right;”>Este é um parágrafo à direita</p>
Podemos também utilizar a propriedade <style> com mais de uma característica para os elementos:
<h1 style=”color:red;font-size:300%”>Título vermelho com a fonte maior</h1>
<p style=”background-color:yellow;text-align:center;color:green;”>Parágrafo com cor de fundo amarelo, texto verde e alinhado ao centro</p>
NOTA: Durante este curso teremos muito mais informações sobre CSS.