O documento discute tags HTML como <font> para alterar a cor, tipo e tamanho da fonte e tags como <b>, <i> e <u> para estilizar texto em negrito, itálico e sublinhado. Ele também explica como criar listas definidas, não numeradas e numeradas usando tags como <dl>, <ul> e <ol> e como adicionar links internos e externos usando a tag <a>.

1. Html e CSS

2. Tags ­ <font>, <B>, <I>, <U> e <S>
● Em algumas situações precisamos utilizar diferentes cores em nosso texto, por exemplo: utilizar a cor
azul no título do texto e a cor preta no corpo do texto. Para esse caso a utilização do atributo text não
solucionará nosso problema, todavia, a tag font funcionará perfeitamente.
● A utilização da tag font não se limita apenas a trocar a cor de uma determinada parte do texto, mas
também o tamanho da fonte e o tipo, para isso utilizamos os atributos existentes nessa tag, que são:
face, size e color. O atributo face é responsável por definir qual o tipo de fonte será utilizada (ex:
Times New Roman, Georgia, Arial, etc), o atributo color é responsável por definir a cor da fonte (seus
valores são os mesmos do atributo text), já o atributo size é responsável por definir o tamanho da
fonte. Vejamos exemplos da utilização da tag font.

3. Tags ­ <font>, <B>, <I>, <U> e <S>

4. Tags ­ <font>, <B>, <I>, <U> e <S>
● Note que apenas a primeira linha do texto será
alterada com os efeitos da tag font. O resto do
texto manterá a formatação definida na tag
body.

5. Tags ­ <font>, <B>, <I>, <U> e <S>
● Praticando!
● Exercício 02.3: Abra nosso arquivo SegundaPaginaHTML.html e salve como com o seguinte
nome: TerceiraPaginaHTML.html, após isso modifique o conteúdo presente dentro da tag body,
digitando o seguinte texto:
● HTML HTML (abreviação para a HyperText Markup Language, que significa Linguagem
de Marcação de Hipertexto) é uma linguagem de marcação utilizada para produzir
páginas na web. Documentos HTML podem ser interpretados por navegadores. A
tecnologia é fruto do "casamento" dos padrões HyTime e SGML.
● HyTime é um padrão para a representação estruturada de hipermídia e conteúdo
baseado em tempo. Um documento é visto como um conjunto de eventos concorrentes
dependentes de tempo (como áudio, vídeo, etc.), conectados por hiperligações. O padrão é
independente de outros padrões de processamento de texto em geral. SGML é um padrão de
formatação de textos. Não foi desenvolvido para hipertexto, mas tornou­se conveniente
para transformar documentos em hiper­ objetos e para descrever as ligações.

6. Tags ­ <font>, <B>, <I>, <U> e <S>
● Muito bem! Agora que aprendemos a estilizar
nossa fonte, com o tipo, e tamanho, por
exemplo, vamos agora ver com estilizar
com negrito, itálico, sublinhado e outros
parâmetros interessantes. A tag b é utilizada
para apresentar trechos em negrito.

7. Tags ­ <font>, <B>, <I>, <U> e <S>

8. Tags ­ <font>, <B>, <I>, <U> e <S>
● A tag hr é utilizada para apresentar uma linha
na horizontal, ela possui o atributo color
responsável por definir a cor da linha.
Note que hr não tem fechamento.

9. Listas de definição
● Para criarmos listas de definição utilizamos as tags dl para
iniciarmos a lista, dt para o termo que será definido e a
tag dd para a definição. Vejamos a estrutura:

10. Listas não numeradas
● As listas não numeradas funcionam semelhantes aos marcadores
existentes em aplicativos como editores de texto. Para criarmos listas não
numeradas utilizamos as tags ul para iniciarmos a lista e li para inserirmos
itens na lista.

11. Listas numeradas
● As listas numeradas são as mais comuns, a
cada item inserido a numeração da lista cresce.
● Esse tipo de lista pode apresentar numeração comum
(1, 2, 3...), numeração com algarismos romanos (I,
II, III..) e até mesmo letras (a, b, c...).
● Para criarmos listas numeradas utilizamos as tags
ol para iniciarmos a lista e li para inserirmos ítens na
lista.

12. Listas numeradas

13. Exercicios
● Crie um novo documento HTML com o nome
ListaHTML.html e crie 3 listas, sendo: 1
lista de definição, 1 lista não numerada
e 1 lista numerada. Se necessário use
mais tags para organizar sua página
web. O resultado desse exercício será algo
similar com a figura 03

14. Criando link: Tag ­ <A>
● Através dos links podemos criar ligações
entre páginas web ou mesmo entre pontos
diferentes da mesma página web.
● O browser destaca um link através dos seguintes
recursos: cor azul, sublinhado e mudança do
ponteiro do mouse (geralmente a seta transforma­
se em uma mão, indicando que aquele trecho é
“clicável”). Para criarmos links em nossas páginas
web utilizamos a tag a, sua estrutura é a seguinte:

15. Criando link: Tag ­ <A>
● Note que utilizamos href para indicar o nome do arquivo
(com extensão) e o caminho do arquivo (nos casos em
que o arquivo em questão encontra­se em outro diretório).
● Depois da “abertura” da tag a definimos qual trecho de
texto (ou mesmo uma imagem) será utilizado como link,
ou seja, tornará­se “clicável”.
● Tudo que estiver entre a “abertura” e o
“fechamento” da tag a será o link.

16. Criando link: Tag ­ <A>
● Alguns atributos importantes da tag a devem ser
estudados, são eles:
– Target: utilizado para indicar o frame que será
carregado ou onde a página/arquivo será
“aberto”. Estudaremos frames posteriormente.
– Name: utilizado para criar um indicador, ou
seja, uma parte do mesmo documento HTML
que será destino do link (links sendo usados
para navegação em uma mesma página). Vejamos
abaixo um exemplo da utilização desse atributo.

17. Criando link: Tag ­ <A>
● Alguns atributos importantes da tag a devem
ser estudados, são eles:
– Target: utilizado para indicar o frame que será
carregado ou onde a página/arquivo será “aberto”.
Estudaremos frames posteriormente.
– Name: utilizado para criar um indicador, ou seja,
uma parte do mesmo documento HTML que será
destino do link (links sendo usados para navegação
em uma mesma página). Vejamos abaixo um exemplo da
utilização desse atributo.

18. Exercicios