Tudo sobre HTML 35
26 pág.

Tudo sobre HTML 35


DisciplinaAnálise Textual9.509 materiais293.875 seguidores
Pré-visualização6 páginas
estáticas não são 
capazes de transmitir. Suas extensões são geralmente .mpg, .mov, .avi. É interessante 
utilizar informações sobre o formato e o tamanho do arquivo de mídia externo A tag 
<IMG> possui atributos que permitem a execução in-line de arquivos de som e vídeo. O 
atributo DYNSRC (para IE) inclui arquivos de vídeo: <IMG DYNSRC=&quot;arquivo.avi 
SRC=&quot;arquivo.gif ALT=&quot;[a arquivo]&quot;>. 
Letreiros 
 Em HTML é possível a criação de letriros, ou seja, uma linha rolável que se moverá 
de um lado ao outro da página da Web. Para que este efeito seja possível basta alocar o 
texto que se deseja transformar em letreiro entre as tags de abertura e fechamento 
<MARQUEE> texto </MARQUEE>. Esta tag possui vários atributos: 
Atributo Utilização 
BEHAVIOR 
1. SCROOL 
2. SLIPE 
3. ALTERNATE 
1. Rola de um lado ao outro da tela e 
até desaparecer. 
2. Rola o letreiro da direita para 
esquerda e para. 
3. Faz o letreiro saltar de um lado da 
tela para outro. 
DIRECTION (somente se o letreiro for 
SCROOL) 
1. Move o letreiro da esquerda para 
direita. 
2. Move o letreiro da direita para 
1. LEFT 
2. RIGHT 
esquerda. 
LOOP 
Define o número de vezes que o letreiro 
ralará na tela. 
SCROLLAMOUNT 
Define o número de pixel para locação do 
letreiro. 
SCROLLDELAY 
Define o tempo da animação em 
milessegundos. 
BGCOLOR 
Define a cor de fundo da caixa que delimita 
o letreiro. 
HEIGHT 
Define a altura da caixa que delimita o 
letreiro. 
WIDTH 
Define a largura da caixa que delimita o 
letreiro. 
HSPACE 
Define o espaço entre as bordas esquerda e 
direita e o texto. 
VSPACE 
Define o espaço entre as bordas inferior e 
superior e o texto. 
ALIGN 
\uf0b7 TOP 
\uf0b7 MIDDLE 
\uf0b7 BOTTOM 
Define o alinhamento do letreiro com 
relação ao texto. 
 
 
 
Listas 
 As lista são utilizadas para organizar o texto quando necessário uma relação de itens 
ordenados ou não. A HTML define 3 tipos de listas: 
\uf0b7 Listas Ordenadas ou Numeradas - essas listas são delimitadas pelas tags 
<OL>(inicializa uma lista) ... </OL>(finaliza uma lista) e cada item desta lista 
começa com a tag <LI>(sem o fechamento). São aquelas que possui um número. 
O atributo TYPE define o tipo de numeração da lista. Assim, A (letras 
maiúsculas), a (letras minúsculas), I (algarismos romanos) e 1 (números 
arábicos). 
Exemplo: 
Código Saída no Browser 
<OL> 
<LI>item 1 
<LI>item 2 
</OL> 
1. item 1 
2. item 2 
\uf0b7 Lista Não-Ordenadas ou com Marcadores - são aquelas que os itens são 
marcadores ou outros símbolos. Estas listas são indicadas pelas tags </UL> ... 
</UL>. Os elementos dessa lista também são separados por </LI>. Nesta lista o 
atributo TYPE define o tipo de marcadores de cada uma delas. Assim, disk 
(marcador preenchido), square (quadrado), circle (marcador vazado). 
Exemplo: 
Código Saída no Browser 
<UL> 
<LI>item 1 
<LI>item 2 
</UL> 
o item 1 
o item 2 
\uf0b7 Listas de Definição ou de Glosários - são aquelas em que cada item tem dois 
componetes, um termo e uma definição. Estas listas são indicadas pelas tags 
<DL> ... </DL>. As tags <DT> e <DD>, unidirecionadas, respectivamente, indicam 
o termo a ser definido e a definição desse mesmo termo. 
Exemplo: 
Código Saída no Browser 
<DL> 
<DT>item 1 
<DD>item 2 
<DD>item 3 
</DL> 
item 1 
item 2 
item 3 
 
 
Tabelas 
 As tabelas são usadas para organizar o conteúdo de uma página, ou seja, imagens 
em linhas e colunas. Com tag <TABLE> conteúdo da tabela </TABLE> indicamos que se 
trata de uma tabela. 
\uf0b7 <CAPTION> ... </CAPTION> - para acrescentar um título na tabela. 
\uf0b7 <TR> ... </TR> - para informar onde começa (<TR>) e onde termina (</TR>) cada 
linha da tabela. 
\uf0b7 <TH> ... </TH> ou <TD> ... </TD> - para identificar o início e o fim de cada célula. A 
diferença entre <TH> e <TD> é que o conteudo da célula da tag <TH> é escrita em 
negrito e centralizada. 
 Agora já podemosfazer uma tabela com estes comandos, que ficaria assim: 
Tabela 
célula 1 célula 2 
célula 3 célula 4 
 Os comandos da tabela acima seria assim: 
<TABLE> 
<CAPTION> Tabela </CAPTION> 
<TR> 
<TH> célula 1 </TH> 
<TH> célula 2 </TH> 
</TR> 
<TR> 
<TD> célula 3 </TD> 
<TD> célula 4 </TD> 
</TR> 
</TABLE> 
 Atributos para a tag <TABLE>: 
\uf0b7 BORDER - define a espessura da borda; 
\uf0b7 WIDTH - define a largura da tabela, pode ser definida em % ou valor absoluto 
(com números); 
\uf0b7 ALIGN - alinhamento horizontal (Right, Center, Left); 
\uf0b7 BGCOLOR - para alterar a cor de fundo; 
\uf0b7 BACKGROUND - permite colocar uma imagem no fundo; 
\uf0b7 CELLSPACING - define o espaço existente entre as células da tabela; 
\uf0b7 CELLPADDING - define o espaço existente entre as bordas da célula e seu 
conteúdo; 
\uf0b7 BORDERCOLOR - usado para alterar a cor da borda. 
 Atributos para as tags <TD> e <TH>: 
\uf0b7 COLSPAN - especifica quantas colunas da tabela a célula vai ocupar; 
\uf0b7 ROWSPAN - especifica quantas linhas da tabela a célula vai ocupar; 
\uf0b7 WIDTH - define a largura de cada célula, pode ser definida em % ou valor 
absoluto (com números); 
\uf0b7 HEIGHT - define a altura de cada célula, pode ser definida em % ou valor absoluto 
(com números); 
\uf0b7 ALIGN - alinhamento horizontal (Right, Center, Left); 
\uf0b7 VALIGN - alinhamento vertical (Top, Middle, Bottom); 
\uf0b7 BGCOLOR - alterar a cor de fundo desse elemento. 
 Uma tabela usando alguns elementos destes ficaria assim: 
célula 1 
célula 2 
célula 3 célula 4 
 Códigos da tabela acima; 
<TABLE BORDER=1 BORDERCOLOR=#ffcc00 BGCOLOR=#6666ff CELLSPACING=2 
CELLPADDING=10 ALIGN=center> 
<TR> 
<TD COLSPAN=2>célula 1</TD> 
<TD ROWSPAN=2>célula 2</TD> 
</TR> 
<TR> 
<TD>célula 3</TD> 
<TD>célula 4</TD> 
</TR> 
</TABLE> 
 
 
Frames 
 Os frames permitem a divisão da tela em diferentes regiões onde pode-se apresentar 
diferentes páginas. Isso possibilita, por exemplo, que se determine a área da tela para 
ser a página principal e outras áreas para menus ou links. 
 A tag <FRAMESET> cria um documento de definição de frames, que é onde será 
criado o layout de cada frame e indicado o nome dos documentos que serão 
apresentados. Essa tag substitui a tag <BODY> quando for utilizada. 
 Deve-se definir um dos dois atributos a tag <FRAMESET> para se ter o layout 
desejado: COLS e ROWS. 
 Com o atributo COLS indicamos quantas colunas teremos na página - <FRAMESET 
COLS=&quot;lagura_coluna, largura_coluna, *&quot;> (a largura podde ser definida em 
porcentagem (%) ou em valor absoluto) - Assim, divide-se quantos frames foram 
indicados e pelo * (asterístico), definimos que o frame ocupará todo o espaço restante da 
tela. 
 O atributo ROWS define quantas linhas a frame será dividida - <FRAMESET 
ROWS=&quot;50%, 50%&quot;> - definimos que a página será dividida em 2 frames horizontais. 
 O atributo SRC indica qual página será chamada em cada frame criado e o atributo 
NAME atribui o nome a esse frame. 
 Existem ainda outros atributos que estão relacionados abaixo: 
Atributos Utilização 
MARGINWIDTH Determina as margens esquerda e direita do frame. 
MARGINHIGHT Determina as margens superior e inferior do frame. 
SCROLLING = YES, 
NO ou AUTO 
Configura a barra de rolagem, podendo aparecer ou não. 
Pode ainda, aparecer somente quando o texto ultrapassar o 
tamanho da célula (AUTO). 
NORESIZE 
Impede que as barras que delimitam os frames sejam 
redimensionados. 
 O código de um documento HTML contendo frames ficaria assim: 
<HTML> 
<HEAD> 
<TITLE> Título da Página </TITLE> 
</HEAD> 
<FRAMESET COLS=&quot;200, *&quot;> 
<FRAME SCR=&quot;página que ficará no 1ª frame&quot; NAME=&quot;nome do 1ª frame&quot;> 
<FRAME SCR=&quot;página que ficará no 2ª frame&quot; NAME=&quot;nome do 2ª frame&quot;> 
</FRAMESET> 
</HTML> 
 A tag <NOFRAME> ... </NOFRAME> coloca o código que substituirá a página caso o 
Browser não dê o suporte ao recurso de frames. Caso o Browser entenda frames, tudo 
que estiver entre tag de abertura e fechamento <NOFRAME> ... </NOFRAME> será 
ignorado e o