Curso de HTML - Aula 4 – Inserindo e Formatando Texto Hitskin_logo Hitskin.com

Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o temaVoltar para a ficha do tema

Aldeia RPG
Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.

Curso de HTML - Aula 4 – Inserindo e Formatando Texto

Ir para baixo

Curso de HTML - Aula 4 – Inserindo e Formatando Texto Empty Curso de HTML - Aula 4 – Inserindo e Formatando Texto

Mensagem por Lief Ter Dez 25, 2012 8:07 pm

[Autor: Gleison]
Curso de HTML - Aula 4 – Inserindo e Formatando Texto Aulcj0




Agora que já aprendemos os tags de inicio vamos aprender como inserir texto e formatar, para isso inicie um novo documento e salve-o com o nome ex2.html, depois o deixe como mostrado abaixo.


</font>Exercício 2<font color="blue">

Curso de HTML
Este é o meu Segundo exercício de HTML,
E nele irei aprender a formatar o texto.

Salve seu arquivo e abra-o no navegador, veja que temos um texto simples sem formatação.



O QUE PRECISO SABER SOBRE FONTES
Antes de formatar a fonte da página você deve ter em mente que qualquer documento de texto, para ser bem visualizado necessita que no computador do usuário tenha a respectiva fonte instalada, por isso não adianta criar sua página usando uma fonte linda que não será bem visualizada pelo usuário porque ele não tem a fonte instalada em seu computador. Para resolver esta questão devem-se usar fontes mais comuns e configurar fontes alternativas.



MUDANDO A FONTE, A COR, E O TAMANHO PADRÃO DO TEXTO DA PÁGINA.
Se você tem acompanhado a aula desde o inicio deve estar lembrado de que eu havia dito que não iria ensinar css porque isso poderia ser definido dentro da própria página, pois bem agora iremos aprender algo que pode ser feito em CSS.
Nós iremos usar o tag e seus atributos face, size e color.
Eles serão usados da seguinte forma , lembrando que não é obrigatório usar os três, você pode usar cada um em separado, porem se usado assim eles devem ter o tag . O tag font deve ser fechado do contrário todo o texto que estiver após ficará com a mesma formatação.
Para definir fontes alternativas, acrescente uma virgula depois da fonte escolhida e coloque o nome da fonte alternativa.
Para definir o tamanho digite um valor de 0 a 6 que são pré definidos ou digite o valor em px.
Para definir a cor utilize os códigos hexadecimais respectivos ou os nomes das cores pré definidas.


Vamos utilizar o código visto anteriormente, ainda no ex2.html acrescente ao código de forma que fique como o abaixo.



</font>Exercício 2<font color="blue">




Salve seu arquivo e abra-o no navegador, veja que temos um texto simples com fonte arial.



MUDANDO A COR[/]
Ainda no ex2.html acrescente ao código de forma que fique como o abaixo.



</font>Exercício 2<font color="blue">




Salve seu arquivo e abra-o no navegador, veja que temos um texto simples com fonte arial e cor vermelha.



MUDANDO O TAMANHO
Ainda no ex2.html acrescente ao código de forma que fique como o abaixo.



</font>Exercício 2<font color="blue">

size=”3”
>
Curso de HTML
Este é o meu Segundo exercício de HTML,
E nele irei aprender a formatar o texto.


Salve seu arquivo e abra-o no navegador, veja que temos um texto simples com fonte arial, tamanho 3 e cor vermelha.



APLICANDO NEGRITO E ITALICO
Para aplicar negrito usamos o tag e para aplica itálico usamos , lembrando que o texto deve estar entre os tag de abertura e fechamento. Vamos utilizar.
Volte ao ex2.html e adcione os seguintes tag para que fiquem como o abaixo.



</font>Exercício 2<font color="blue">


Este é o meu Segundo exercício de HTML,
E nele irei aprender a formatar o texto.


Salve seu arquivo e abra-o no navegador, veja que o texto aparece em negrito e italico.



ALINHANDO CARACTERES
Para alinhar usamos o tag
com o atributo align. O atributo align pode assumir os seguintes valores: Left(esquerdo), Center(centralizado), right(direita) e justify(justificado).

Volte ao ex2.html e adicione os seguintes tag para que fiquem como o abaixo.



</font>Exercício 2<font color="blue">


>

Este é o meu Segundo exercício de HTML,
E nele irei aprender a formatar o texto.



Salve seu arquivo e abra-o no navegador, veja que o texto aparece em negrito, itálico na cor vermelha, tamanho 10 e fonte Arial.



PULANDO LINHA E PASSANDO PARA A PRÓXIMA
Como você já deve ter percebido o texto que foi digitado não tem quebra de linha e nem pula de linha, a única linha pulada foi por causa do tag de alinhamento, como já foi dito antes o HTML precisa ser programado em tudo inclusive na quebra de linha e pulo. Para isso usamos o tag
para ir para a próxima linha e o tag

para pular uma linha, esses tag não necessitam ser fechados e são usados após a ultima palavra.

Volte ao ex2.html e adcione os seguintes tag para que fiquem como o abaixo.



</font>Exercício 2<font color="blue">



Este é o meu Segundo exercício de HTML,

E nele irei aprender a formatar o texto.



Salve seu arquivo e abra-o no navegador, veja que o texto agora tem um fim e após o titulo há uma linha pulada.



TAG H1 A H6
Esses são tags pouco usado, nada mais são do que títulos pré formatos onde um valor de H menor indica um texto maior e um valor de H maior um texto menor.



DIVISÓRIAS
Esses são tags pouco usado, o tag de divisória é o hr que pode ter como atributo Align(pode ser Left - esquerdo, Center - centralizado, Right - direito),Width(Largura), Color(cor) e size(espessura).



LISTAS ORDENADAS E INORDENADAS
Um recurso interessante é a criação de lista para isso deveram usar o tag
    para listas sem ordem e
      para listas ordenadas, para iniciar a lista usa-se o tag
    1. após o tag de lista.
      Crie um novo arquivo e salve com o nome ex3.html.



      </font>Exercício 3<font color="blue">



      • Lista inordenada

      • lista inordenada2



      1. Lista Ordenada

      2. Lista Ordenada







      ATRIBUTO
        Lista inordenada podem usar o atributo TYPE com propriedade CIRCLE(CIRCULO COM CONTORNO PRETO E FUNDO BRANCO), DISK(CIRCULO TODO PRETO), SQUARE(QUADRADO PRETO).



        ATRIBUTO
          Lista ordenada pode usar o atributo TYPE com propriedade 1(numérica), A(alfabética), I(Romana). Pode-se usar o atributo START, indicando qual será o valor inicial da lista.



          Exercício
          Crie uma pagina:
          Nome:exepratico1.html
          Titulo:Exercicio Pratico
          Texto Centralizado: Aulas de HTML
          Pule uma linha
          Texto restante na cor: #FFFF00
          Texto Restante: Esse é o meu primeiro exercicio prático,
          e nele pretendo praticar o que foi aprendido ate agora.
          Crie como foi citado inclusive respeitando as quebra de linha



          Legenda:
          Texto azul = Códigos e atributos do HTML
          Texto Azul em negrito = Codigos a serem adcionados ao codigo já existente.
          Texto preto = Conteúdo da pagina.
          Texto verde = Observações e considerações importantes.



          Perdeu alguma aula?, Quer saber qual é a proxima? Visite o Indice
          Clique aqui Clique aqui para visitar o site oficial
          Lief
          Lief
          Desenvolvedor
          Desenvolvedor

          Mensagens : 834
          Créditos : 50

          http://shafou.com

          Ir para o topo Ir para baixo

          Ir para o topo

          - Tópicos semelhantes

           
          Permissões neste sub-fórum
          Não podes responder a tópicos