0% acharam este documento útil (0 voto)

237 visualizações5 páginas

Resumo Livro Use A Cabeça HTML Com Css e XHTML

Este documento apresenta uma introdução à linguagem HTML, ensinando suas principais tags e elementos para estruturar páginas web, adicionar estilo com CSS, criar formulários e tornar as páginas interativas.

Enviado por

Amando Lourenço

Direitos autorais

Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.

Formatos disponíveis

Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd

0% acharam este documento útil (0 voto)

237 visualizações5 páginas

Resumo Livro Use A Cabeça HTML Com Css e XHTML

Enviado por

Amando Lourenço

Direitos autorais

Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.

Formatos disponíveis

Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd

Você está na página 1/ 5

1.

Comece a entender o HTML

A linguagem da Web

COMENTRIOS:

TAGS:
Ttulos: <h1> ... <h6>
Pargrafo: <p>
<html>
<head>
<title>...</title>
</head>
<body>
...
</body>
</html>

ELEMENTO = Tag de Abertura + Contedo + Tag de

Fechamento

TAGS:
<style type="text/css">
...
</style>

2. V alm com o hipertexto

Conhea o HT do HTML

TAGS:

<a href="....html">...</a> Usa-se .. para subir

para o diretrio pai.

3. Construo de blocos
Construo de pginas Web

TAGs:

<img src=...>
<q>...</q> Pequenas citaes.
<blockquote>...</blockquote> Citaes longas. No
preciso estar dentro de um pargrafo.

ELEMENTOS DE BLOCO: <h1>, <h2>, ..., <h6>, <p> e

<blockquote>.
ELEMENTOS EM LINHA: <q>, <a> e <em>.

TAGs:
<br> Quebra de linha.
<ol> Lista ordenada.
<ul> Lista no ordenada.
<li> Item de uma lista.
<code>
<em>
<address>
<strong>
<pre>
<hr>

4. Conecte-se
Uma viagem Weblndia

TAGs:

<a target=_blank href="....html#ancora"

title=Ttulo id=ancora>...</a> Como acessar uma
ncora e como criar uma.

5. Adicione imagens a suas pginas

Conhea a mdia

TAGs:

<img src=... alt=Descrio curta da imagem

width=largura height=altura>

6. Padres, conformidade e tudo o mais

HTML srio
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
http://validator.w3.org/

TAGs:

<meta http-equiv="Content-Type" content="text/html;

charset=ISO-8859-1">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

7. Mude para o XHTML

Coloque um X no HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/Xhtml1/DTD/xhtml1-strict.dtd">

TAGs:

<html xmlns=http://www.w3.org/1999/xhtml lang=en

xml:lang=en>

8. Conhea as CSS
Adicione um pouco de estilo
Cada declarao em CSS = um local + uma propriedade
nesse local + um estilo a ser aplicado quela propriedade.

Regra:
p { background-color: red; }

TAGs:

<link type="text/css" rel="stylesheet"

href="....css" />

/* Comentrio em CSS */

elemento.classe (ou .classe para todos os membros da

classe)
{
...
}
Obs.: Adicionar o atributo class ao elemento.
http://jigsaw.w3.org/css-validator/

9. Aplique estilo com fontes e cores

Expanda seu vocabulrio

Propriedades relacionadas a fontes:

font-familly:
font-size:
font-style:
color:
font-weight:
text-decoration:
border-bottom:

10. O modelo de caixa

Seja ntimo dos elementos

Modelo de caixa: Contedo Enchimento Borda

Margem

11. Divs e spans

Construo avanada na Web

Selecionando descendentes:
pai filho { ... }

TAGs:
<div> ... </div> Para elementos em bloco.
<span> ... </span> Para elementos em linha.

Pseudo-classe:
elemento:estado { ... }

12. Layout e posicionamento

Arrume os elementos

O layout flutuante:

float + clear

O layout gelatina:
<div> em todo o contedo + margens em auto.

O layout absoluto:
Posicionamento absoluto.

13. Tabelas e mais listas

Torne-se tabular

TAGs:
<table>
<tr> Linha
<th> ... </th> Clula de ttulo
</tr>
<tr>
<td> ... </td> Clula normal
</tr>
</table>

14. Formulrio XHTML

Torne-se Interativo

TAGs:
<form action=... method=...>
...
</form>
<input type=text name=... />
<input type=submit />
<input type=radio name=... value=... />
<input type=checkbox name=... value=... />
<textarea name=... rows=... cols=...></textarea>
<select name=...>
<option value=...></option>
</select>

Resumo Livro Use A Cabeça HTML Com Css e XHTML

Enviado por

Resumo Livro Use A Cabeça HTML Com Css e XHTML

Enviado por

1.

Comece a entender o HTML

COMENTRIOS:

ELEMENTO = Tag de Abertura + Contedo + Tag de

2. V alm com o hipertexto

<a href="....html">...</a> Usa-se .. para subir

ELEMENTOS DE BLOCO: <h1>, <h2>, ..., <h6>, <p> e

<a target=_blank href="....html#ancora"

5. Adicione imagens a suas pginas

<img src=... alt=Descrio curta da imagem

6. Padres, conformidade e tudo o mais

<meta http-equiv="Content-Type" content="text/html;

7. Mude para o XHTML

<html xmlns=http://www.w3.org/1999/xhtml lang=en

<link type="text/css" rel="stylesheet"

elemento.classe (ou .classe para todos os membros da

9. Aplique estilo com fontes e cores

Expanda seu vocabulrio

Propriedades relacionadas a fontes:

10. O modelo de caixa

Modelo de caixa: Contedo Enchimento Borda

11. Divs e spans

12. Layout e posicionamento

13. Tabelas e mais listas

14. Formulrio XHTML

Você também pode gostar

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.