O HTML

•

UNIP

0

Bruno Pereira

27/10/2017

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Você viu 3, do total de 5 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

E aí, curtiu este material?

Ajude a incentivar outros estudantes a melhorar o conteúdo

Gostou desse material? Compartilhe! 🧡

Web Designer

361 Materiais compartilhados

Baixe o app para aproveitar ainda mais

Leia os materiais offline, sem usar a internet. Além de vários outros recursos!

Prévia do material em texto

O HTML
Apesar de o Dreamweaver disponibilizar várias ferramentas que facilitam a confecção de páginas Web, é desejável, no entanto, que se conheça a estrutura básica e as tags mais utilizadas na linguagem HTML.
Os comandos em HTML são chamados de tags (ou rótulos), e eles irão dizer ao navegador como o texto, a informação e as imagens serão formatadas e exibidas. Por exemplo, uma tag pode dizer que um determinado texto será exibido em negrito, itálico e com um tipo de fonte qualquer. Além de formatação de texto uma tag também pode dizer que na verdade um determinado bloco desse texto está ligado a um endereço para outra página Web.
As tags HTML são identificadas pelos símbolos <> (em uma tag de abertura) e </> (em uma tag de fechamento). Ou seja, quando você especifica uma tag de abertura para a formatação de um bloco de texto, você deverá também, especificar a tag de fechamento, logo no final desse bloco de texto. Portanto, a maioria das tags são duplas.
As tags HTML não são case-sensitive, ou seja, sensíveis a maiúsculos e minúsculos, portanto tanto faz escrever<HTML>, <Html>, <html> ou <hTmL>.
A estrutura básica
Primeiramente, devemos saber que um programa HTML é dividido em três partes básicas: a estrutura principal, o cabeçalho e corpo de texto.
	Estrutura Principal
	
Corpo de Texto
Cabeçalho
	
A estrutura básica de um documento HTML são linhas obrigatórias e essenciais para um bom funcionamento de uma página Web.
Observe a seguir essa estrutura:
<HTML>
		<HEAD>
			<TITLE> Título da página </TITLE>
		</HEAD>
		<BODY>
			Aqui será montada a página.
		</BODY>
</HTML>
Essas tags aparecem apenas uma vez nos arquivos HTML, e são responsáveis por montar as partes da página. A linguagem HTML pode ser editada no Bloco de Notas do Windows, porém, para que não seja salvo com a extensão “.txt” (típica do bloco de notas, será necessário salvar o arquivo junto à sua referente extensão, ou seja, “.htm” ou “.html”.
As tags básicas
Quebras de Linha
<P></P> 
	Exemplo:
	Resultado:
	<P>Primeira linha.</P>< P> Segunda linha.</P>
	Primeira linha.
Segunda linha. 
<BR> 
	Exemplo:
	Resultado:
	Primeira linha.<BR>Segunda linha.<BR> 
	Primeira linha. 
Segunda linha. 
Texto em negrito
<B></B> 
	Exemplo:
	Resultado:
	Curso de < B> Confecção de Web básico</B>
	Curso de Confecção de Web -básico 
Texto em itálico 
<I></I> 
	Exemplo:
	Resultado:
	Centro de Computação <I>CCUEC</I>
	Centro de Computação CCUEC 
Centralizar texto
<center></center>
Texto à direita
<right></right> 
Texto à esquerda
<left></left> 
	Exemplo:
	Resultado:
	<center>Centro de Computação</center>
	Centro de Computação
	<right>Centro de Computação</right>
	Centro de Computação
	<left>Centro de Computação</left>
	Centro de Computação
Formatação do texto 
	Exemplo:
	Resultado:
	<FONT FACE=Arial color=red size=2>Centro de Computação</FONT>
	Centro de Computação 
Listas Não Ordenadas 
	Exemplo:
	Resultado:
	< UL>
< LI >NOME < /LI >
< LI > TELEFONE < /LI >
< /UL>
	· NOME
· TELEFONE
Listas Ordenadas 
	Exemplo:
	Resultado:
	<OL>
< LI > ENDEREÇO< /LI >
< LI > CEP< /LI >
< /OL>
	ENDEREÇO
CEP
Barras horizontais 
< HR > = marcação de linha
Size = espessura
Width = largura
	Exemplo:
	Resultado:
	< HR SIZE= 2 width= 100% >
	
Inserir imagens 
	Exemplo:
	Resultado:
	<img src="exemplos/ator.jpg> 
	
Links 
<A>< /A>
HREF= referência a página a ser aberta 
TARGET = _BLANK : abre a página em uma nova janela do browser chamando uma página: (arquivos com extensão .htm ou .html) 
	Exemplo:
	Resultado:
	< A HREF= " /exemplos /pagina.html" TARGET= _BLANK>Clique aqui!!!< /A>
	Clique aqui!!! 
Exibindo uma imagem a partir de um link: (arquivos com extensão .gif ou .jpg)
	Exemplo:
	Resultado:
	< A HREF= " /exemplos /ator.jpg" TARGET= _BLANK> Marquês de Sade!!!< /A>
	Marquês de Sade!!! 
Fazendo download de um arquivo (arquivos com extensão .DOC, .TXT, .ZIP):
	Exemplo:
	Resultado:
	< A HREF= " /exemplos /texto.txt" TARGET= _BLANK>Leia na íntegra!!!< /A>
	Leia na íntegra!!!
Recebendo e-mails: 
	Exemplo:
	Resultado:
	< A HREF= "mailto:xxxx@unip.br">Clique aqui < /A> para enviar sua opinião!!
	Clique aqui para enviar sua opinião! !
Chamando uma página em outro servidor: 
protocolo:// servidor / diretório / arquivo
Os protocolos mais usados são (file ou http):
File = arquivo no servidor de ftp
http = arquivo no servidor World Wide Web
	Exemplo:
	Resultado:
	< A HREF=”http: //www.google.com” TARGET = _BLANK>Vá para o Google!!!< /A>
	Vá para o Google!!!