apostila html

apostila html
feita por: emmanuel
!"#
$
%$&%
'(
)
*
+,
)
) ), -./
),
0
./),
/
1
,
)
+
1'+
'
)
/
2 !
)"
/#)
)
0
,
)'
0'./
'
,
)
0 ./
)
"!#
0
)
)
),)./
• !#0)
)'
)
0 .
)./
03 •$0
2
)
20
)
/
/
.
0
),
./
3
•%&
0
0
)0
2
0
)
)
*
)
*
•#'
.1
).1'
).
)
22
).1
0)
0
).
"#
,,.1+
).
3
("!
#
0
)
)./
./
)./
0
)
)
)'
./
)/
/)/4
./
)
4
)
./4
/1
/
.)
/4
0
•).1
0),
2
.1
./
/3
•
'+ -
./
3
3
./
3
,),
),
)
+
'+
/
),)
)
,
).1/
).1
./
"
/
#
/
).
2)./
3
•
./ 0),
./0
0
0
.1
,
./+
)
"
./#
.1
.
3
"
)4
)
4
)
0
/ / 0./
'
0
•)
0
.1'
2
/),
),
.1
0
./
)
)3
•
#'
+)
01
.1-
)
)
)
)
/
.
.1"
)
)
#./3
/4
)0 "
,#
./)
)
+2
./),
)
)
*"
#+#,
2
./
1)
)
/
./ ')
'
.//
•)
5/)
).1
0
+
/
/+
'
./-./&./)/)
./0),
/
3
•),
'.-)
,./+)
+/
+
/
),
0/
,+
"
/
,/
/
.#0)./
2)
)
/0
/&
./&
,./
3
)
./
,./0
)
./"
0
'+#
,
-
),./
/
).
)
2)
0
.
,/)
-
'
)
,'
'
.1
+
.
$%+ +
$&%$%6&&6
,7
)
7
)
"#8
"#9
"6#
99
)"97#8
6
)"6#
:
""#7;6#
:
)"
#
"#
$&%
./0$ %
!
1).1
")
#
).1
,+
,./
!
./0
)
./)
1!
)
)
!
.!
!
/
/
'
))
+
).1
!
!
),
)
0
!
.!
)
!
.!
/
)
/
•
,./
)
3
•
))/)
+
'
)
•
)
3
•/
)
)
)
"1#
0)
$)%
$
4,<=
/%
$&)%
valor padrão
• /3
•
/
0),
-
•
2
,+
'
1
/
)
/
$)%
$
<4
%
$
<4
/%/
$&)%
/
•),
> &)
)2
$)%
$
<4
<6
%%/
$&)%
********
•)/&
./)/&0
1
$)%
$
<4 %
$
<4 %
$
<4 %
$&)%
•
/
)
+
//
$)%
$
<4
)
%
$&)%
enviar formulário
•1
/
)
-
./
//
$)%
$
<4
%
$&)%
apagar dados
&
),+
)2
&) +
&.&
)
-"#
$)%
$?6<
)%
$&%
$&)%
exemplo de texto dentro do cam
/
./1
.)
)
$)%
$,7%
$
%
%
$
0%0
$
%
$
%
$&%
$&)%
).
0
+
.1
0
1
"%
(0
).)
$
!%$&%
0
$4 "<#%
'
!&
)
)
+
.1
.
$)%$
7<%
)
)7"#8
") 976766#3
:
)"
#8
"@$@9
)9@
4)" ?)? 6 ?6#
"#
)"#%@#
)7
:
$&%
,
•
)
"
,0)0-
'
&
!
'
)
'
;),
)..
-
0
)
./
)
(0
).)
$
)%$&%
0
)$4 );"#%
);"#
*0
$&4%
$7
4
3
4 3)<A3A63
,+<%$&%
))
)
0
/)
))
/)
)
)
)02
A676A6
)
0
),
,
)
/ ./
+
.1
0
"%
(0
$&4%
$
%$&%
'
!
)
0
+
.1
0
!"%
(0
.
$7
4
343%
$ 7667B
6;%
$%
$B)<)<)<%
$)),<
B666666%$%
$&%$&)%
$&%
$&%
$%
$B)<)<)<%
$ )7 %$)),<
B))((66%7$&)%$&%
$&%
$&%
$%
$B)<)<)<
$ )< %$)),<
B))((66%<$&)%$&%
$&%
$&%
$%
$B)<)<)<%
$ )? %$)),<
B))((66%?$&)%$&%
$&%
$&%
$%
$B)<)<)<%
$ ); %$)),<
B))((66%;$&)%$&%
$&%
$&%
$%
$B)<)<)<%
$ )A %$)),<
B))((66%A$&)%$&%
$&%
$&%
$&%
$&%
$
)
%
$&%
,
• •,
• •.
';(
,
)
./
0
)0
4
)
)'+
0
)
(0
).)
$44&%
B
8
3);C63
7D6:
B8
3
);C63?;6:
B8
3
?663 <663
) 37=63)7C63
"6?66<666#3
4 :
B8
363
)6:
$&4%
$
%$&%
?
/
/
&.
./
)
0
.//
./ 0
.//
/
0 0
%
*
B8
3 ?663 <663) 37=63
)7C63"6?66<666#34 :
alterado:450; height:350; overflow:hidden; top:180; left:170; clip:rect(0,450,350,0);
visibility:hidden}
E
-.1
./
&
0
.
$
%
$ )B
"+
C#
"#%$
) <<
?D
6%$&%
$&%
$%
$ )B
"C#
"#%$
) <<
?D
6%$&%
$&%
$%
$%
$%$)
) ,<%
$%$%
,
$%
$%
&
$%
$&)%
$&%
$&%
/
)/
2
'
%//
'
)0
*0$
';(
,
)
),
)
+)
.)
$
7<%
$E++
!@@
)6
6
)"
#
"@$
4
3 7A637
3
+ 34 3)+
)43)+,7;%@9!9@$&
%@#
)
)
"#8
)"6#8
44
7
:
4)
4)9976
4
494976
:
)
"#8
44 :
)"
#8
)
)")E6#
""#)>7666#
:
&&++%
$&%
,
• •
•)
•,
)
'
!%2
0
2))
*
)
//
)
)
)
)
)
))
.1
/))
),)
"
#))
./
'7(',
)
)
))
) !
'
)
),
)
, ./
'
.1/)./") #
./
)" # <
)
$
C%$))
,<% $&)%$&
%
)
)
)0
/
•
+)
)
2/
C
•+)./)
+)
)+)
+)
+)
•+)
,)
/0))/
0
).
)
3
#
0
)
/
+'/
//
+
/
4
2
'
. /
+/
,.1
/
).
./)
)
).1
.
.),
*4*
;6;"/
#
)
)
)
)
,/)
4/)
;6;
).
/";(=(6#
0+'
,+
)
0)
,"7<#
./
!#
"4 ) #
)))'), 0 )'+
2
02
.1
"./ #
$
4)" <7#3 C6%
$ 7%
$)
)%)$
&&&*)&666=&
C? (66%$&)%
$& 7%
$&%
/
!
)
!55
0)
)
.1'
"#)"
#
2
+
+
!
"./ #
$
4) "666666(676#3 C6%
$ 7%
$)
)%$
&&&*)&666=&
C? (66%$&)%
$& 7%
$&%
/
!)
)
0)
)
.1'
"#"F
./#
!
))
/2
+
!
"./ #
$
4)
" 76<<67#3 C6%
$ 7%
$)
)%)
/$
&&&*)&666=&
C? (66%$&)%
$& 7%
$&%
/
!
)
!
0)
)
.1'
)"#"F
./#
%
/
/
-
!4 +)
$
!4 %$&%
/
!
!
'
)
/
' /
+
.1
$4%$&4%
$!
) 67 ;66 ?66 <6
<6%$&)%
F
)
!
)
)
)
)
)
)
F '
F ' >))
(
)
.2'
./
+)$& %
$
%
$E++
)
" #8
4
@ @
)"
4#
4"# :
)
" #8
4
@@
)"
4#
4"# @@
@@
:
&&++%
$&%
$&4%
$7<6
<66%
$%
$4
+
" @@#
" #%
$ ) &&%$),<
)%$%$&%$&)%$&%$&%$&%
$4
+
" @@#
" #%
$ ) &&%$),<
)%$%$&%$&)%$&%$&%$&%
$4
+
" @@#
" #%
$ ) &&%$),<
)%$%$&%$&)%$&%$&%$&%
$4
+
" @@#
" #%
$ ) &&%$),<
)%$%$&%$&)%$&%$&%$&%
$4
+
" @@#
" #%
$ ) &&%$),<
)%$%$&%$&)%$&%$&%$&%
$%
$ 7=%$)
),<%$&)%$&%$&%
$&%
)
) ) /
% & ))./)
'
!)
)/)
) ,
)0),
) '.
$
,),).
2
2
/)
-"0#-
)0
))
)0)/+ /
"2
2
#
!6
+
,
/)
)
/)
+ )0./ "
#,./
"&+
&#
!)
7
!!
'
.
)
.)
)2
$&%
2
$%
$)%
$&%
$%
$)%$&%
!)
!6
!!
./
F )2)0
.
./
$&%2
)
=
$ %
$ %
$%'
$&%
$& %
$4%2 $&4%
$& %
•)
.)
')
3
•).)'). 3
•..)./'
3
•.3
!
/)
)+2
?66
E
)0
,
-
,
'')0
'
)
(
CD?DCD?D"+
')
#
)./)
/53
5
)"
)+
)
,))+
&
5)
,
).
+
)
0
+$
)
G%
+
$&%
.1
+FF
VXEMHFW
ERG\
)
0+
.+
./"*#
F
F
"H#
)
$
)
G*
+H
GH40
%
+$&%
,
,
/
0
!&
),
/ ./
4
./
'
.
./ 0
+)
.)
$44&%
$E++
8
+
3
:
8
+3
:
&&++%
$&4%
,
)
)0
<I
(0
$
7<
)%$&%
0
)
!&"%+
0
/
'
!
/<)
)
2
)/1
0
2
)0),
)
,./
)
,
)
'
• !
)/)3 • !
.1!
!
!
)
./
)")#
2)
"-#
-!
!
2
).
."
2
#
!
.!
1
)
.!
)
+
•
1
+
'
8
3
•
1 +
'
8
3
•
!
.)"
#3
•
!
/)
"
/)
4
+#3
!
.!
0
!
2
!
/)
/!
)
.1
/
•
!
.)"
#3
•
!
/)
"
/)
4
+#
1+
!
!
3
•
)))
)
)3
•
))
)3
•
)
),
3
•
!
/3
•
40
)
"
4)
)
./
2)#3
•
) )3
&
2
!
$)A6J>?6J)7
)?%
$)7 ,%
$)< < ?,
4%
$)? )
,%
$&)%
)/0
2
0),1)
./
#'
./
).0+
,"2
#
0
0
/),
./
0+
/+)
,
/
!#
0),
)
)
'(
+)
.)
$4%
8
:
$&4%
$
7<%
?
6
7
)
" #8
6
4)6
46
:
)
"#8
)
""E
HHE
4#KK7#
)"7#8
4" 4#9
:
)"<#8
4)" 4)#9
:
)"?#8
4" 4#+
:
8
4)" 4)#+
:
)"$;#
99
7
""#A6#
:
)
" #8
7
4)6
46
:
$&%
)
$%
" #3"#
" #3)
"#
)
"#
)
95&&!) 7?6 A6
6 " #3"#
" #3)
"#)
"#5
&
!
0
)
+
.1
0
"%
(0
).)
$
%
$&%
$
%
3
$&%
,
•
0
.
$ <%$
4%$&%$& <%
$%
)"
KK
4#8
"
4#*
4"
#
6"#
:
"#
$&%
,
• '
%
0
00
0 00
)
0
&
55
$ ) "@@#%
0 ,
0./
0+
)
-
-)
.1
)
//
/)+
/
0)
./
- )
).
00
0
++
$ %
$ %
$ +
) 3
&&&
%
$%'
$&%
$& %
$4%2 $&4%
$& %
)
'
.1)
++
0)
00
)
)
)
cursor para mover
style="cursor:move"
cursor padrão de link
style="cursor:hand"
cursor padrão de texto
style="cursor:text"
cursor de espera
style="cursor:wait"
cursor de ajuda
cursor de precisão
style="cursor:help"
style="cursor:crosshair"
./
.1
apontando para cima (norte)
style="cursor:n-resize"
apontando para baixo (sul)
style="cursor:s-resize"
apontando para a direita (leste)
style="cursor:e-resize"
apontando para a esquerda (oeste)
apontando para nordeste
style="cursor:w-resize"
style="cursor:ne-resize"
apontando para sudeste
style="cursor:se-resize"
apontando para noroeste
style="cursor:nw-resize"
apontando para sudoeste
style="cursor:sw-resize"
)
.1
4
0 ),
.1
3
./
0)
,
0
,
,3/
,
/./"./#)
0/
'
1
0
4
/
+
'
.1
)
/
),
/
)
)
/
) /
,
0
,./
+
,
).1
, ,
,
#
./,-
,
'
,
,
,./
,
,
,./
./
,
,
4
./
)
/./
, )"
3 #3
,766J,+
,++'
)
:
).1
,
./F
,)
.1
./)
.1
./
.
)
"
./)#
,)+
)
/AA
0,
0
)
+
)
$4%
48
+?+ +B))66663
++B))((663
++B66))663
++ +
B??DD??3
+)+B6666663
+ +B6666))3
+ +B??((DD3:
$&4%
./
)
,./
1
+
!
0
)
"/
#
)
"/
)#
)./)
$ )B
)"@ &&@@
+ @#3%$% $&%
)$&)%$&%
)
0
'
1A0
'./
)
/!&
./0
/
)
)
.1
).)
$44&%
48
"@)@#)+
B)6?D:
$&4%
)
))
"
#//)
)
3
)
')
0++
%#/
0
"#
./
,
0/)
)
,
0
)
)'
./ +
.1
0
"%
(0
).)
$4%
B8
)+)43
)+,;3
:
B8
)+)4
)+,=3
:
$&4%
,
•) '
•) 0
.
$4
3
4 3%$&%
$4
%
$E++
<663
73
))<3
))4<3
)B??))3
B66??DD3
B6666663
B))))))3
BDD))3
&&++%
$&%
$
%$&%
,
• •
*0
./
0+
$ ) &&
"@ E@@@#3
3
"#3
3%$&%
•
• ./
•'
•,
'
3#
) )
F
• ,./"#).
0./)
3 •"#
,
/
.
3
• "#) 20"6DD#,
,
-
+
95453
• "# -
")#
" #"#"#
"#3
•
"))#)
/
3
•
")#)
/
3
•. ,")#)
.
)/)/
3
•."#)
.
)/)/
3
$)
) C? (6
<
%
)
,'
/
))
,
.
/
/)
<?;L2
*
.
,
/.
,
/
),).
954595459545
• )
•).
•).2
/
)
0
/
),
.
+$ %
$& %
$4%
$E++
7
83
+3
)+,7<3
)+)4:
8
+
3
:
++%
$&4%
$%)
7
)
$ ) &&
955%$&%
,
)
./
'
0
/)
./
•3+)
'
)0
•3+),
..
•)+,7<) ) )7<0+
•)+)4+))
'
,)
'0
.
/.
'(
55
2
/
/)./
)
'
/1/
/),
2
/
'+
.
$ ) 4"+7#
!)%$&%
0
/
'
0.
0'
).)
)
)
) )
.1
)'
L
/
.1" ,#
'
//
)
).
!
"4 ) #
)./)
0 )'+
.1
/
'
!!
!
)
./)
)
.1
0./
$
4,<6
4
3)+)4
3)+ 3)+,763
B??66((
)
%
1+-
).1) !
formulários com CSS
0/")
#!3
!
"#!3 " #"#
!!
)
,0
$
4,<64+
B((DD))3+43)+
)43)+
,7<3B??66((
%
/
)
)
4
bordas em CSS
03"
#3"#
5!)%5
0
./
3
)
./) )
./
/
)
)./
)
./) +
0
) .
$
)"#%) $&%
';CA(
1
/-/
/0
/
)/)
//
)/
)
)
./
+,)
)
/ $ )B
)"#%
$&%
$ )B
)"#%$
&)
6%$&%
$)%$
4
)"#%$&)%
,,./
,./
.')
+
)
')
-3
)'
,
)'
$%$%'
$%
#)3)
)
)
. /)
2,
2
)
/ )/
$%$ %. $ %
)3
')
).
./
'
../2 ./)
.') 3
)
/ "/. #
2) -
'
"
.1#
)+
$%$%
#./.
.1
)
/
•
')
6",#)
/
'
73
•) ,
!"-
#"#)"-#
)
,2./3
) 3
) 2
3
•) "#
"#
"#
)
2./
)3
) 3)
23
•/
)
)
•)
)
0
)
-
)
+
3
•F)
/
)
) 3
•F
+
2)
2
/+-
3
•F
,
+
, 2)
2
/+-
3
•)))
3
•))
3
!
.1
0)
)
)
),.1
0 .1
)F
'./
)
./
.)
0
)
./
$
%
$E++
)
)
"#8
3
:
++%
$&%
$
) )
"@B))((66@#%
B))66$&%
•
•
•
•
B))66
B((
B))))))
B??((DD
),
"
"
#
0
/
)!
0
2
)
)' )
+
/)
)/)
,
)
)
)
4
74
)
)
)
)
/
)
/ < )
)
)
?0 )
))
./)
)
)
0 )
)
./)
)
))
;),
./))
./
'
/)
$)
)<
<=%$&)%
A
)
0)
/
/
()
+
)
0 ' C))?6J
+ ) )
=)
./
./
)
) ) 0)
+
/
.
)
+''
3
a tag <body> (e a tag de fechamento </body>) delimitam todo o conteúdo da home
page. é aí que aparecerão os textos, as figuras, o fundo de tela, entre outras coisas.
dentro da tag <body> você conseguirá formatar o conteúdo, especificando os seguintes
atributos:
•)
"
/#
)
) )
3
•)
"
#)
)
03
•/"
&#/
)
03
•/"
/#/
)
03
•/"
/#/
))
03
•/"
/#/
)
03
!
)
)
•
03
•
23
./
0
•"#B666666
•"#B666
•4",#B=6=6=6
• "#B))))))
•"#B=66666
•" #B))6666
•
"#B=666=6
•"#B))=666
•)
"#B))66))
•"#B66=666
•"/#B66))66
•"#B=6=666
•4"#B))))66
•4",
#B6666=6
•
",
#B6666))
•"#B66=6=6
&$
2 )2
2/
/)
/)
./
0
+
/)
))
)))
))
7#
)
• #
*4&*;4
)
=66(66"(6J#
2)"<AJ#)
(;6;=63
•!6 #
"!0
<A()
3
•
&
*
"!
;
)
3
•"#
/
'<A3
•6
))
3
•
,./)
3
•0
,
./4
/
/)
") #
3
•
/)3
•
/
/
23
•!)
/23
• )/
./ +
//
3
•#
)
3
/. 0).1
).1
.1
2 %&
$4 %
$
%
&
)
• /
./+ 3 •
./2
)
+3
+
. ").)#
+ "
#),).
.1
)
0+
!
44" 4
4
+
00
0#)
2/
)
)
0)
0)0
/)'
, 0 / 2
3$
)
2"
# -
")#-
" #,"#/
$ %2 $%$&%
$&%
2 )
'./
2 !
2>
2 2
$% )
)
4"
#
0
"
#
3-
"
) .#)'
'
• 3 •. 3
•
3
)!3#/
"
/
+
)!
),
)
$ ) &&
!%
$%$&%$&%
)
-
)0
),
951/5
("
/
+)!
$ ) &&
!%$)
)%$&%
9545
"
/
1
+
")1#)! 1
./
$
%
)/ 7#
/) .
<#/
$
)B%
$&%
)!) /
)
)
B
/
B
)!) $&%
/
)
/
*"
/#
.
+)!
)!.
+
.
$
)
G%+
$&%
+
/
55
$%),
.
./
$%
)
$%
)
/)
$%
)3#)
)'). . ).1
//
./
).1. /).4
"
0),
) #
.1
==AD+7)
//
./ 2)
4
./
'
/
0"
'
/
#
.1
0
)0.1
/
?
,'
0.
M0)0),
)
H3
N
H
3
H3
F
H3
-
H3
O
H3
/
H
3
P
H3
.
H 3
Q
H
3
H3
0
H3
R
H
3
'
H3
S
H3
T
H
3
U
H3
V
H3
V
H3
5
H3
W
H 3
X
H 3
X
H
3
Y
H 3
Z
H
3
2
H
3
[
H
3
\
H
3
M
H4
3
]
H
3
H3
F
H3
N
H3
-
H3
O
H3
/
H
3
P
H3
.
H
3
H3
0
H3
R
H 3
Q
H
3
^
H
3
'
H3
S
H3
T
H
3
U
H3
V
H
3
H3
5
H3
W
H3
1
H
3
Y
H,3
_
H 3
Z
H
3
2
H
3
[
H
3
\
H
3
M
H4
3
]
HB7(73
`
HB7(<3
a
HB7(?3
b
HB7(A3
c
HB7((3
d
HB7(C3
e
HB7(=3
f
HB7(D3&H43
g
HB7C63
h
HB7C73
i
HB7C?3
HB7C;3&H3
j
HB7CA3
k
HB7C(3
l
HB7CC3
m
HB7C=3
n
HB7CD3
o
HB7=63
p
HB7=73
q
HB7=<3
r
HB7=?3
s
HB7=;3
t
HB7=A3
u
HB7=(3
I
HB7=C3
v
HB7==3
w
HB7=D3
x
HB7D63
y
HB7D73
z
HB<7A3
{
HB<<<3
Z
HB<;C3
|
H3
H
H3
$
H3
%
H
3
6
+ 0
,'.
2
/
,27<?
')
,
.
+
$%
$%
'
$%.
$%'
$%.
$&%
)
1.
'
2.
.
3.
'
4.
.
3)
).
/
) ,.
/
)