Comandos HTML: Guia Rápido e Prático
Traduzido por
ScribdTranslationsComandos HTML: Guia Rápido e Prático
Traduzido por
ScribdTranslationsGUIA RÁPIDA DE COMANDOS HTML
O HTML (HYPERTEXT MAKE UP LANGUAGE) são comandos com os quais se desenvolvem as páginas WEB.
A continuación hay una lista con algunos de los comandos usados en HTML.
DESCRIPCION INICIO FINAL COMENTARIOS
Obrigatórias
Toda a codificação deve
Princípio de
<html> </html> estar incluída nestas
Documento
etiquetas
Dentro do cabeçalho se
Encabezado <head> </cabeça>
encontrará o título.
É o texto que aparece na
Título <title> </título>
barra de títulos do navegador
Cuerpo <corpo> </body> Corpo da página
Para toda la página
Permite colocar uma cor
uniforme de fundo a toda a
<body bgcolor="#RRVVAA"> página. Esta cor estará
formado por 3 números
Color de Fondo hexadecimais que indiquem:
RR= tonalidade da cor vermelha
VV= tonalidade da cor
verde
AA= tonalidade da cor azul
[Link]á
<body substituir pelo nome
Imagem de Fundo
background="[Link]"> de la imagen. Se recomienda
utilizar formatos .gif ou .jpg
Permite definir as cores
<body text="#RRVVAA">
que se aplicarão em forma
Colores de texto Link ="#RRVVAA"
genérica para o texto como
cor de links Vlink ="#RRVVAA"
para los enlaces. El color está
enlaces visitados Alink ="#RRVVAA"
representado por um número
hexadecimal
Permite definir um estilo de
Estilos <style> </style> fuente, color, tamaño, etc
para todo o documento.
Permite definir propriedades
internas do documento.
<meta Name = "description"
name="description" content = ”Será el resumen
Meta content="comentarios" </meta> com o que será publicado no
name="keywords" content="palabra1 buscador. Não utilizar mais de
palavra2 ... palavran 25 palavras
Name = "keywords"
content ="podrán definirse
palabras claves para que
nosso documento seja
encontrado por los
buscadores
Reproduza um arquivo de som.
[Link] deve ser substituído
pelo nome do
arquivo;loop indica a
<bgsound
quantidade de vezes que se
src="[Link]"
repetirá.
loop=infinito/n>
A etiqueta Embed com seus
<embed
propriedades, é utilizado pelas
Som src="[Link]"
incompatibilidades dos
width=200 height=55
navegadores.
autostart="true"
Com esta opção aparece uma
loop="true"
consola cujas dimensões se
hidden="true"
definem
conWidthoHeighty que
pode se esconder
conHidden = verdadeiro
Apresentação de texto
Opções de formato de texto
Encabezamientos<h1><h2>....<h6> </h1></h2>....</h6>
para cabeçalhos,
Negrita <b> </b> Coloca o texto incluído com
Cursiva <i> </i> estes formatos.
Subrayado <u> </u> </u>
Parpadeio <blink> </blink> O texto estará piscando
Grande <grande> </big> Aumenta o texto
Pequena <pequeno> </small> Diminua o texto
Subíndice <sub> </sub> Representa el texto sobre el
Superíndice <sup> </sup> renglón ou abaixo do renglón.
Permite colocar uma cor à
fonte. A cor está
Cor do Texto <font color="#RRVVAA"> </font>
representado por um número
hexadecimal.
Defina um tamanho de fonte
especí[Link]-senta um
Tamanho do
<font size="n"> </font> número de 0 a 7 ao qual
Texto
depois poderão adicionar-lhe os
signos + o -
Permite definir um nome de
Tipo de fuente <font face="nombre da fonte"> </font>
Fonte específico.
Formato de fonte Courier de
Estilo de fuente <tt> </tt>
tamanho menor (Máquina de escrever)
Formato de fonte tipo
Texto
<pre> </pre> Mensageiro. Eles representam os
preformatado
espaços em branco
Texto em Permite que un texto tenga
<marquee>(texto) </marquee>
Movimento movimento. Podem
agregarse atributos para
dimensionar a marquise,
para alinhar o texto, para
modificar tamanho, fonte e
cor.
Trace uma linha horizontal
Não utiliza etiqueta
Linha Horizontal <hr="n"> cuyo grosor está representado
de fechamento
por "n"
Não utiliza etiqueta Representa um espaço em
Espacio en Blanco 
de fechamento branco.
Comentários que não serão
Comentario <!-- comentário --> ->
visíveis na tela.
Permitem que os caracteres
Escrevo Para ver especiais sejam lidos por
< < todos os navegadores em seus
> > distintas versiones.
& &
A escrita de cada caráter
"
começa com o signo
áá
ampersand (&) e deve
éé
terminar com ponto e vírgula (;)
íí
óó Nesta tabela vemos como
úú escrever alguns símbolos,
Caracteres
especiais ÁÁ signos, as letras Ñ e ñ, e as
É vogais acentuadas em
ÍÍ maiúscula e minúscula.
Ó
Ú
ñ
Ñ
ü ü
Ü
¿¿
¡
Apresentação de parágrafos
<center> </center> Todo texto que se escreva
Alineaciones <esquerda> </left> entre estas etiquetas sofrerá
<direita> </direita> essa alineação.
É utilizado para destacar uma
Sangria <blockquote> </blockquote>
citação.
Realiza a separação entre
Parrafo parágrafos, e o alinhamento de
<p align= center*left*right*justify> </p>
estes.
Renglones em Permite deixar linhas em
<br>
branco branco
Tratamento de imagens
Permite insertar una imagen
na página em que estamos
desenhando. O arquivo da
a imagem deverá estar localizada
Imagem Individual<img src="[Link]">
na mesma pasta que a
página, caso contrario se
deverá indicar sua rota de
acesso
Coloca um texto que poderá
Texto da <img src="[Link]" /> leia ao passar o ponteiro do
imagem alt="texto"> mouse sobre a imagem ou
quando esta não carrega.
Indicará a posição em que
ubicaremos ao texto que
Alineación del <img src="[Link]" >
acompaña a la imagen
texto alinhar= topo * meio * fundo>
TopArriba *MiddleMedio
Fundo
Defina o tamanho da
<img src="[Link]" > imagem
Largo
largura="n" Width= ancho *height=
Alto
altura="n"> alturan= será un valor en
pixels
<img dynsrc="[Link]" Permite agregar arquivos de
Vídeos loop=infinite controls vídeo.
iniciar= mouseover>
Listas
Se utiliza quando as
<ol type= A * a * I * i start=n>
as opções devem ser
<lh> título de la lista </lh>
numerados. A opção
Lista numerada <li> Primeira opção </ol>
representar número ou
Segunda opção
letras ystartindicará o
<li> Terceira opção </li>
número con que inicia.
<ul type=square * circle * disk> É utilizado quando as
<lh> título da lista </lh> opções não apresentam um
Lista não ordenada<li> Primeira opção </ul> ordem determinada. A
<li> Segunda opção opção typerepresenta a
<li> Terceira opção </li> vinheta.
<dl> É utilizado quando as
<lh> título da lista </lh> opções levam um título e
<dt> Primeiro tema uma definição
Lista com Primeiro detalhe
</dl>
sangrado Segundo detalhe
Segundo tema
<dd> Terceiro detalhe
<dd> Cuarto detalle
Links ou Enlaces
xxxdeve ser substituído por a
Link para outro
<a href="xxx">yyy </a> endereço URL de destino do
URL
link.
sim, o texto indicativo que
será lido na página.
Te permite um link direto
Link para um <a href = "[Link] e-mail">
</a> a seu cliente de e-mail
e-mail texto indicativo del enlace
predeterminado
Marca para Referencia uma posição à
enlace dentro de <a href="#marca"> Texto de enlace ao que depois será acessado.
</a>
a mesma página âncora
Ancla
Enlaça uma posição
Localizar enlace
<a name="marca"> texto del ancla </a> previamente marcada, dentro
anterior
da mesma página
Link para outro Vincule à posição
página con marca,<a href="[Link]#marca"> texto estabelecida na marca, na
</a>
dentro do mesmo indicativo do link página [Link]
sitio
xxxdeve ser substituído por a
endereço URL de destino do
link.
[Link] deve
Enlace com <a href="xxx"><img
</a> substituir pelo nome de
imagens src="[Link]">
imagen seleccionado
Vincule ao endereço URL
clicando sobre a
imagen.
Tabelas
Definição <table> </table> Crie uma tabela
<table border=n n= representa a espessura do
Bordas bordercolor="#RRVVAA"> borde. Também se poderá
Color de Bordes especificar a cor da borda
As células poderão ser separadas
Separação entre
<table cellspacing=n> por elnvalor
células
Separação entre O conteúdo poderá estar
a borda e o <table cellpadding=n> separado da borda pelo
conteúdo valor indicado enn
Pode-se estabelecer um valor
Alto <table height=n o porcentaje>
o un porcentaje para definir
largo largura=n ou porcentagem>
o tamanho da tabela
<table bgcolor="#RRVVAA"> Se puede establecer un color
Cor de Fundo ou background="[Link]"> de fundo de toda a tabela ou
Imagem de Fundo colocar uma imagem de fundo
Possibilita colocar um título a
<caption
Título </caption> a tabela alinhadotopo=em cima
alinhar=cima * baixo> texto do título
obottom=abajo
<tr Por cada fila que tenha a
Definição de filas </tr>
align=left*center*right a tabela deverá ser utilizada esta
valign=top*middle*bottom etiqueta: poderá ser estabelecida
bgcolor="#RRVVAA"> a alinação do conteúdo, a
localização dentro da fila e
el color de fondo.
<th Permite definir os nomes
Definição de align=left*center*right*justify*decimal das colunas.
</th>
títulos valign=top*middle*bottom*baseline
bgcolor="#RRVVAA">
<td Coloca conteúdos a cada
Definição de alinhar=esquerda*centro*direita*justificar*decimal célula
</td>
dados ou conteúdosvalign=cima*meio*baixo*base
bgcolor="#RRVVAA">
Celda que ocupa É possível combinar uma célula
<td rowspan=número de filas> </td>
muitas filas para que ocupe muitas linhas.
É possível combinar uma célula
Celda que ocupa
<td colspan=numero de colunas> </td> para que ocupe muitas
muitas colunas
colunas.
Formulários
Inicia um formulário. Se
Definição <form> utiliza para a entrada ou o
envío de datos.
Envie a resposta
<form action="[Link]
imediatamente à
Ações método=post
endereço especificado em
Texto referente
formato de texto.
Insira um objeto dentro do
formulário, deverá ser definido
el tipo de objeto, el nombre
<input
do campo formulário, o
tipo="texto"
valor inicial que se lhe é atribuído,
Introdução de name="nome do campo formulário"
o tamanho máximo de
dados value="asignación de un dato"
visualização do campo e o
size="número"
tamanho máximo de caracteres
maxlenght="número">
que puede tener ese campo.
Com o type = "text" não se
atribui Valor
checkbox= se visualiza un
botão quadro de verificação, sim
caixa de seleção desejamos que apareça
arquivo tildado
escondido agregamos CHECKED.
Opções de imagem password= el ingreso se
tipo senha representa com asteriscos.
rádio radio= visualiza botones de
reiniciar rádio e permite que o usuário
enviar escolha uma opção entre várias.
texto Se agregam tantos inputs quanto
opções desejamos.
reset =visualiza un botón
que ao clicar apagará
os dados.
submit= visualiza un botón
que ao clicar enviará
os dados.
crie um campo para
inserir caracteres
alfanuméricos
<textarea Permite inserir um texto
Entrada de um
name="nombre del campo formulario" extenso, por exemplo
texto que ocupa </textarea>
rows="cantidad de filas" comentarios
muitas linhas
cols="cantidad de columnas">
<select name="nome do campo"> Permite optar pelos dados de
formulario"> um menu
Ingresso por meio
<option>1ª opção </select>
de um menu
<option>2º opción
3ª opção
Molduras o Marcos
Inicia a definição de um
Definição <frameset> </frameset>
quadro.
Defina dois quadros em
colunas ocupando uma o
20% da tela e o outro o
Frames en
<frameset cols="20%,80%"> 80% restante.
colunas
<frameset rows="30%,70%"> Defina dois quadros em filas
Moldura em filas
ocupando uma 30% da
tela e a outra 70%
restante
Defina em que quadro se
cargará cada página.
<frame src="[Link]">
Conteúdo de Será atribuído um nome neste
<frame src="[Link]"
cada quadro casoprincipalpara indicar
name="principal">
que se visualizem lá os
futuros enlaces
É utilizado como atributo de
um link e indica em que
o quadro deverá ser visualizado
link.
"_ blank" = se abrirá una
nova janela do navegador
Destino do frame target="principal" e se visualizará nela.
"_self" = el enlace se carga
no próprio quadro.
"_top" = el enlace se carga a
tela cheia na
mesma janela, suprimindo
os outros quadros.
Atributos del tag Border = 0 indica que não
frameset borda=0 haverá buracos de separação
frameborder=0 entre quadros (para
framespacing=0 Netscape).
frameborder = 0 indica que
não haverá borda de separação
entre quadros.
framespacing = 0 indica que
não haverá buracos de
separación entre frames (para
Explorador).
Frameborder =elimina os
bordas de uma moldura
marginwidthymarginheigh
frameborder="não" definem o largura e altura de
marginheight="número" as margens do quadro.
marginwidth="número" name= define el nombre del
Atributos da tag
name="nombre del frame" moldura.
quadro
sem redimensionar Noresize= indica que o quadro
scrolling="yes/no/auto" não poderá ser redimensionado.
src="direçã[Link]" scrolling= indica se terá ou
sem barra de deslocamento.
src= indica o conteúdo do
quadro.
Se o navegador não conta
com a possibilidade de incluir
Frames, com esta tag pode
Se a estrutura não definir uma direção
<noframes> </noframes>
pode ser visualizado alternativa. Se coloca depois
dos tags FRAME e levam
dentro de um texto definido entre
os tags <body> </body>