Vamos colorir a nossa quarta aula?
Os documentos HTML tratam as cores de acordo com o padrão RGB (vermelho, verde e azul).
Uma cor RGB é representada como um número hexadecimal, prefixado pelo símbolo #, o qual é uma combinação de tonalidades das cores vermelho (red), verde (green) e azul (blue). São possíveis 255 tons de cada uma das cores (em hexadecimal variando de 00 a ff); dessa forma, uma cor RGB pode ser representada desde o preto (#000000), o qual na verdade é a ausência de cores, até o branco (#ffffff), que é a mistura de todas as cores.
A tabela abaixo mostra algumas cores mais utilizadas:
Cor
|
HEXADECIMAL
|
Nome da Cor
|
preto
| 000000 |
black
|
branco
| ffffff |
white
|
vermelho
| ff0000 |
red
|
verde
|
00ff00
|
green
|
azul
|
0000ff
| blue |
cinza
|
dddddd
|
gray
|
amarelo
| ffff00 |
yellow
|
magenta
| ff00ff |
fucshia
|
violeta
|
cc00ff
|
purple
|
ciano
|
00ffff
|
aqua
|
marrom
|
800000
|
maroon
|
verde-limão
|
00ff00
|
lime
|
bronze
| 99cc00 | olive |
As cores podem ser descobertas na base da tentativa e erro ou utilizando-se o programa freeware "RGB Color Box", que pode ser obtido fazendo-se o download aqui.
Ou, pode procurar tabelas de cores pela Internet. O programa acima é interessante porque você pode criar infinitas cores, misturando as três cores básicas. É um programa executável, mas pode ficar tranquilo, NÃO É VIRUS.
O elemento Br
A principal diferença entre a página HTML e o editor tradicional é que a página não reconhece o fim de uma linha com o pressionamento da tecla Enter. Você precisa forçar a quebra de linha usando comandos especiais. O comando responsável pela quebra de linha é o <br>. Essa tag não precisa ser fechada.
O elemento P
Como o HTML não faz distinção de espaços em brancos ou quebras de linha presentes na codificação, torna-se necessário, o uso da tag <p> para promover a quebra e o espaçamento dos parágrafos do texto.
Atributo para P
Align = Permite modificar o alinhamento à esquerda (padrão) dos documentos. O atributo align pode receber como parâmetros: right, center, left e justify, que representam respectivamente, alinhamento à direita, centralizado, à esquerda e justificado.
O elemento Hr
Uma forma simples de separar as seções de uma página pode ser feita através da tag <hr>. Ela traça uma reta horizontal no local especificado.
Atributos para Hr
Noshade = A configuração padrão cria uma reta em três dimensões, esse atributo permite a criação de uma reta em negrito.Size = Este atributo determina a espessura da reta.Width = Determina a largura da reta.Align = Determina o alinhamento da reta. Pode assumir os parâmetros: left, right, center e justify.
O elemento Blockquote
Permite que o parágrafo fique alinhado dos dois lados.
O elemento Dd
É usado para criar um parágrafo na primeira linha.
O elemento !--
É possível inserir informações que são propositalmente ignoradas pelo navegador (comentários) em qualquer parte do código. Estas informações devem estar entre <!-- e >. Por exemplo:<!-- Este é um comentário>
O elemento Div
Essa tag cria uma divisão no documento e alinha o texto pertencente a essa divisão.
Atributo para Div
Align = Determina o alinhamento do texto. Pode assumir os parâmetros: left, right, center e justify.
O elemento Address
É usado especialmente para indicar informações sobre o autor e a página. Normalmente, o texto formatado com a tag <address> apresenta-se em itálico.
O elemento Nobr
Permite que um determinado trecho de um documento não seja dividido em linhas diferentes pelo navegador.
O elemento Center
Essa tag centraliza textos e imagens da mesma forma que faria a tag <div> com align="center".
Para praticar o que você aprendeu até aqui, e todos os exercícios que virão com as próximas aulas, abra um "Notepad" ou "Bloco de Notas" e escreva cada exercício abaixo, salvando como "HTML". Depois, abra sua página HTML para ver o que você aprendeu.Nota: Se você quer mesmo aprender, NÂO copie e cole, DIGITE, só assim você aprenderá de verdade.
Exercícios:
1) primeira.html<html><head><title>Minha Primeira Página HTML</title><meta name="keywords" content="tutorial, html"><meta name="description" content="web design, curso, html"> </head><body bgcolor="blue" text="#ffffff">Esta é a minha primeira página.</body></html>
2) segunda.html<html><head><title>Minha Segunda Página HTML</title></head><body bgcolor="#cc00ff" text="white">Esta é a minha segunda página.<br>Usei a tag "br" para passar à esta linha.<br><br>Avancei duas linhas por ter usado duas vezes a tag "br".</body></html>
3) terceira.html<html><head><title>Minha Terceira Página HTML</title></head><body bgcolor="pink" text="red"><p align="right">Este texto está alinhado à direita</p><p align="center">Este texto está centralizado</p><p align="left">Este texto está alinhado à esquerda. A primeira vista parece que o alinhamento à esquerda e o alinhamento justificado são iguais.</p><p align="justify">Este texto está com alinhamento justificado. E para não haver qualquer dúvida entre os alinhamentos à esquerda e justificado, copio e colo o que foi escrito até agora.Este texto está com alinhamento justificado. E para não haver qualquer dúvida entre os alinhamentos à esquerda e justificado, copio e colo o que foi escrito até agora.</p><hr size="10">A reta acima está em três dimensões e tem espessura igual a 10.<br><hr noshade size="10" align="center" width="200">Na reta abaixo foi utilizado o atributo "noshade" com alinhamento centralizado e largura igual a 200. </body></html>
4) quarta.html<html><head><title>Minha Quarta Página HTML</title></head><body bgcolor="#0000ff" text="#00ff00"><blockquote>Este é um exemplo da utilização da tag "blockquote". Como podemos ver, esta tag alinha o parágrafo nos dois lados da página.</blockquote><dd>E este é um exemplo da tag "dd". Esta tag cria um parágrafo na primeira linha do texto, que originalmente está alinhado à esquerda (padrão).<!-- Este é um comentário ></body></html>
true comentários:
Postar um comentário