2. Formatação de texto
• Cor
• Tags básicas
• Formatação de parágrafo
• Formatação de fonte
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
3. CORES
• Um recurso essencial no desenvolvimento
de páginas para web são as cores.
• As cores, se bem utilizadas, causam uma
experiência excelente para o internauta
que acessa sua página.
• As cores tem a capacidade de despertar
diferentes emoções e sensações em
nossos cérebros (pesquisar sobre
pscologia das cores).
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
4. CORES
• Para a criação de páginas web utilizamos
o padrão de cores RGB
• R – Red
• G – Green
• B – Blue
• Sua utilização em HTML pode ser com
seu nome em inglês ou seu valor
hexadecimal.
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
5. CORES
• Valores em inglês:
– Red
– Green
– Blue
• Valores Hexadecimal:
– #FF0000
– #00FF00
– #0000FF
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
6. CORES
• Utilizando os valores HEXADECIMAL
temos um conjunto do # + 6 elementos:
• #FF0000
• Cada 2 elementos desse conjunto
representa um valor RGB
•#FF0000
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
7. CORES
• Cada elemento pode receber um valor
que vai de 0(sem a cor) até F(a cor
utilizada no máximo)
• 0123456789ABCDEF
• A vantagem de se utilizar dos valores
hexadecimais é o alcance de tonalidades
que dificilmente são representadas por
palavras.
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
8. Tags Básicas
<b> Teste </b> Teste
<i> Teste </i> Teste
<s> Teste </s> Teste
<u> Teste </u> Teste
<b><i><u>Teste</u></i></b> Teste
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
9. Formatação de Parágrafo
• É utilizada através do conjunto de tags
<hX> onde x vai de 1 até 6.
• Formata o texto com tamanhos
predefinidos e com uma quebra de linha
automática após a finalização da tag:
<h1> ... </h1> <h2> ... </h2>
<h3> ... </h3> <h4> ... </h4>
<h5> ... </h5> <h6> ... </h6>
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
10. Formatação de fonte
• A tag para formatação de fonte é a <font>.
• Ela possui parâmetros que nos permite
alterar a cor, o tamanho e o tipo da fonte.
• Esses parâmetros podem ser
combinados.
• <font color=“”> cor em inglês ou sua
codificação hexadecimal.
• <font face=“”> nome do tipo de fonte
• <font size=“”> tamanho de 1 à 7
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
11. Formatação de fonte
<font size=“3” color=“red”> Teste </font> Teste
<font color=“red” face=“comic sans ms”>
Teste </font> Teste
<font color=“green” face=“courier new”
size=“7”> <b> Teste </b> </font> Teste
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
12. Exercícios
Construa uma página da web onde serão
desenvolvidos os exercícios abaixo
• 1) Escreva a frase “Meu Brasil brasileiro” com
cada palavra com um tipo e uma cor diferente.
• 2) Escreva a frase “Um país de várias culturas,
raças, povos, nações, um mundo dentro de um
país, um país dentro de um mundo” utilizando
negrito e itálico para destacar as palavras
culturas / raças / povos / nações / mundo .
MICROCAMP AMERICANA – WEB DEVELOPER – HTML / CSS
