HTML Trabalhando com textos Autoria WEB Prof. Alan Santos
Trabalhando com textos No corpo do documento é onde estará localizado o título e subtítulos, texto, imagens, ligações com outras páginas, etc. Nesta seção veremos como trabalhar com os textos. Títulos e Subtítulos Para demarcar títulos e subtítulos, usaremos as TAGs de HEADER (H1 a H6), juntamente com a opção CENTER. Observações: A TAG CENTER têm a função de deixar o cabeçalho ou texto centralizado.
Trabalhando com textos <html> <head> <title>Curso de HTML </title> </head> <body> <H1>Título com H1: Órgãos Colegiados</H1> <H2>Título com H2: Órgãos Colegiados</H2> <H3>Título com H3: Órgãos Colegiados</H3> <H4>Título com H4: Órgãos Colegiados</H4> <H5>Título com H5: Órgãos Colegiados</H5> <H6><CENTER>Título com H6 centralizado: Órgãos Colegiados</CENTER></H6> </body> </html>
Estilos de texto Além da TAG <CENTER>...</CENTER> existem as seguintes TAGs que podem ser utilizadas para a formatação de um texto. <B>...</B> Aplica o estilo negrito. <I>...</I> Aplica o estilo itálico. <U>...</U> Aplica o estilo sublinhado (nem todos os browser o reconhecem). <SUP>...</SUP> Faz com que o texto fique sobrescrito. <SUB>...</SUB> Faz com que o texto fique subscrito.
Estilos de texto <PRE>...</PRE> Utiliza a pré-formatação, ou seja, deixa o texto da maneira em que foi digitado. <P> A TAG responsável pela quebra de parágrafos é a <P> que finaliza o parágrafo e insere automaticamente uma linha em branco entre parágrafos. Sintaxe do comando: <P align=”posição”> Texto do parágrafo. Posição pode ser: Left: alinhamento à esquerda. Center: centralizado Right: alinhamento à direita <BR> Quebra de linha
Estilos de texto <html> <body> <title>Curso de HTML</title> <B>Estilo negrito.</B> <br> <I>Estilo itálico.</I> <br> <U>estilo sublinhado (nem todos os browser o reconhecem)</U><br> <SUP>Texto sobrescrito.</SUP> <br> <SUB>Texto subscrito.</SUB> <br> <PRE>Este é um pequeno texto com estilo pré-formatado.</PRE> <p align="center"> Este é um exemplo do primeiro parágrafo centralizado. <p> Este é um exemplo do segundo parágrafo. </body> </html>
HTML Tags Básicas Tag Descrição <h1> to <h6> Define cabeçalhos 1 a 6 <p> Define um parágrafo <br> Insere uma quebra de linha <hr> Define uma linha horizontal <!-- --> Define um comentário
HTML Tags de Formatação Descrição <b> Formata um texto em negrito <big> Formata um texto com fonte maior <em> Formata um texto com ênfase <i> Formata um texto em itálico <small> Formata um texto com fonte pequena <strong> Formata um texto em destaque <sub> Formata um texto subscrito <sup> Formata um texto sobrescrito <ins> Formata um texto sublinhado <del> Formata um texto anulado
HTML Entidades Utilizadas para apresentação de caracteres especiais em html. Ex.: “<“ Saída Descrição Nome da Entidade Número Espaço sem quebra < Menor que < > Maior que > & E comercial & & " Aspas " " ' Apóstrofo ' (does not work in IE) '
ESPAÇAMENTO ENTRE PALAVRAS Em programação HTML, ainda que seja dado mais de um espaço entre duas palavras apenas um terá efeito. Para mais de um espaço pode-se utilizar o comando Exemplo: Valor         150,00 Uma marca de tabulação pode ser conseguida com o comando: <p style=‘margin-left: 16’>
ALINHAMENTO DE TEXTO Para deixar um texto centralizado, alinhado a esquerda ou a direita, utiliza-se os seguinte comandos: <p align=‘center’>centraliza texto</p> <p align=‘Left’>texto a esquerda</p> <p align=‘right’>texto a direita</p> <p align=‘justify’>texto justificado</p>
TAMANHO, COR E TIPO DA FONTE Para definir cor, tipo ou tamanho da fonte utiliza- se o comando <font>. Exemplo: <font color=#ffffff size=3 face=arial> Onde: color é cor, size é tamanho e face é o tipo. faça uma pesquisa na web e descubra milhares de códigos de cores HTML. Configurando uma fonte <font size="2" face="Verdana">Texto com fonte específica.</font>