Você está na página 1de 16

FUNDAMENTOS DA

WEB
(Cabeçalhos, Listas e outros elementos)

Prof Silvano Oliveira


prof.silvano.oliveira@gmail.com
Cabeçalhos
<body>
 <h1>Ementa de Fundamentos Web</h1>
 <h2>Objetivos</h2>
</body>

<h1> a <h6>

2 Prof Silvano Oliveira


Linha horizontal
<body>
 <h1>Ementa de Fundamentos Web</h1>
 <hr/>
 <h2>Objetivos</h2>
</body>

3 Prof Silvano Oliveira


Colocando alguma informação
<body>
<h1>Ementa de Fundamentos Web</h1>
<hr/>
Curso:Técnico em Informática
Área Profissional: Informática
Disciplina: Fundamentos Web
Carga-horária: 60h
<h2>Objetivos</h2>
</body>
4 Prof Silvano Oliveira
Quebra de Linha
<body>
<h1>Ementa de Fundamentos Web</h1>
<hr/>
Curso:Técnico em Informática <br/>
Área Profissional: Informática <br/>
Disciplina: Fundamentos Web <br/>
Carga-horária: 60h <br/>
<h2>Objetivos</h2>
</body>
5 Prof Silvano Oliveira
Ops... algo saiu errado (ou não)

Ementa de Fundamentos Web


--------------------------------------------------------------------------------------------
Curso: Técnico em InformÃ!tica
Ã[]rea Profissional: InformÃ!tica
Disciplina: Fundamentos Web
Carga-horÃ!ria: 60h
Objetivos

6 Prof Silvano Oliveira


Codificação de caracteres

Texto em ISO-8859-1 apresentado com UTF-8

Texto em UTF-8 apresentado com ISO-8859-1

Fonte: http://pt.wikipedia.org/wiki/Mojibake

7 Prof Silvano Oliveira


Codificação de caracteres

8 Prof Silvano Oliveira


Como memorizar
 1) Não memorize, tabelas existem para serem consultadas.
 2) Algumas regras gerais:
– Acento agudo: &Xacute;
– Acento circunflexo: &Xcirc;
– Acento grave: &Xgrave;
– Til: &Xtilde;
– Letra com trema: &xuml;
– Cedilha: &Ccedil;
– Letras unidas: &aelig;
– Letra com argola: &Xring;
– X é a letra a ser acentuada

9 Prof Silvano Oliveira


Corrigindo a bagunça
 <h1>Ementa de Fundamentos Web</h1>
 <hr/>
 <body>
 Curso: Técnico em Inform&aacute;tica
 &Aacute;rea Profissional: Inform&aacute;tica
 Disciplina: Fundamentos Web
 Carga-hor&aacute;ria: 60h
 <h2>Objetivos</h2>
 </body>

10 Prof Silvano Oliveira


Corrigindo a bagunça
● Informe para o navegador qual a codificação do arquivo
<head>
 <meta http-equiv=”Content-Type”
 content=”text/html; charset=iso-8859-1″>
</head>

<head>
 <meta http-equiv=”Content-Type”
 content=”text/html; charset=utf-8″>
</head>

11 Prof Silvano Oliveira


Listas não-ordenadas
<body>
 :
<h2>Objetivos</h2>
<ul>
<li>Produzir páginas web...</li>
<li>Criar Scripts ...</li>
<li>Estruturar o conteúdo...</li>
<li>Usar ferramentas de autoria web</li>
</ul>
</body>

12 Prof Silvano Oliveira


Listas ordenadas
<body>
 :
</ul>
<hr/>
<h2>Bases Tecnológicas</h2>
<ol
type="i">
<li>Linguagem XHTML</li>
<li>Folhas de Estilos</li>
<li>JavaScript</li>
</ol>
</body>

13 Prof Silvano Oliveira


Sublistas
 :
<ol type="i">
<li>Linguagem XHTML</li>
<ol type="a">
<li>Conceitos de Redes...</li>
<li>Introdução a XHTML</li>
<li>Validação de páginas XHTML</li>
</ol>
 :
</ol>

14 Prof Silvano Oliveira


Personalizando listas
<body>
:
</ol>
<hr/>
<h2>Avaliação</h2>
<ul type="square">
<li type="square">Avaliações</li>
<li type="circle">Trabalhos</li>
<li>Trabalhos</li>
</ul>
</body>

15 Prof Silvano Oliveira


Perguntas???

16 Prof Silvano Oliveira