Dreamweaver CS3 Komedi

Fone: (19) 3234-4864
E-mail: editora@komedi.com.br
Site: www.komedi.com.br
DWR 9.0
Fone: (19) 3234-4864

E-mail: editora@komedi.com.br
Site: www.komedi.com.br
DWR 9.0
Adobe
Adobe
Dreamweaver
Dreamweaver
verso CS3
verso CS3
Copyright by Editora Komedi, 2009
Copyright by Editora Komedi, 2009
Dados para Catalogao
Dados para Catalogao
Rimoli, Monica Alvarez

Jang, Renan
Rimoli, Monica Alvarez

Jang, Renan
Adobe Dreamweaver
verso CS3
Adobe Dreamweaver
verso CS3
Campinas: Editora Komedi, 2009.
Campinas: Editora Komedi, 2009.
210 p.
210 p.
ISBN: 978-85-7582-499-3
ISBN: 978-85-7582-499-3
Adobe Dreamweaver CS3 marca registrada da Adobe Systems Incorporated

nos Estados Unidos e/ou em outros pases.
Adobe Dreamweaver CS3 marca registrada da Adobe Systems Incorporated

nos Estados Unidos e/ou em outros pases.
Nenhuma parte desta publicao poder ser reproduzida, armazenada ou

transmitida de qualquer modo, ou por qualquer meio, seja mecnico, eletrnico,
fotocpia, gravao ou outros, sem prvia autorizao escrita da Editora Komedi.
Nenhuma parte desta publicao poder ser reproduzida, armazenada ou

transmitida de qualquer modo, ou por qualquer meio, seja mecnico, eletrnico,
fotocpia, gravao ou outros, sem prvia autorizao escrita da Editora Komedi.
Editor:
Gerente de Vendas:
Diagramao:
Capa:
Srgio Vale
Sandro Celestino de Arajo
Monica Alvarez Rimoli
Felippe dos Santos
Editor:
Gerente de Vendas:
Diagramao:
Capa:
Srgio Vale
Sandro Celestino de Arajo
Monica Alvarez Rimoli
Felippe dos Santos
Todos os direitos reservados na forma da lei pela:
Todos os direitos reservados na forma da lei pela:
Editora Komedi
Rua lvares Machado, 460, 3 o andar
13013-070, Centro, Campinas, SP
Tel/fax: (19) 3234.4864
www.komedi.com.br
e-mail: editora@komedi.com.br
Editora Komedi
Rua lvares Machado, 460, 3 o andar
13013-070, Centro, Campinas, SP
Tel/fax: (19) 3234.4864
www.komedi.com.br
e-mail: editora@komedi.com.br
2009
2009
Impresso no Brasil
Impresso no Brasil
ndice
1.
O AMBIENTE ADOBE DREAMWEAVER CS3 .....................................................9
ndice
1.
1.1.
1.2.
1.3.
1.4.
INSTALAO DO DREAMWEAVER ..............................................................................9

ARQUIVOS UTILIZADOS NA APOSTILA .....................................................................10
A INICIALIZAO DE DREAMWEAVER .....................................................................10
REA DE TRABALHO DREAMWEAVER .....................................................................11
1.4.1. Criao de uma pgina em branco ...............................................................13
1.4.2. Viso Geral da rea de Trabalho.................................................................13
1.4.3. Viso Geral dos Menus ................................................................................16
1.5. O QUE NOVO NO DREAMWEAVER ..........................................................................17
1.5.1. Outros recursos importantes.........................................................................18
1.6. FECHAMENTO DE ARQUIVOS ....................................................................................19
1.7. A FINALIZAO DO DREAMWEAVER .......................................................................20
1.8. EXERCCIOS ..............................................................................................................20
2.
SITES DREAMWEAVER .........................................................................................23
1.1.
1.2.
1.3.
1.4.
INSTALAO DO DREAMWEAVER ..............................................................................9

ARQUIVOS UTILIZADOS NA APOSTILA .....................................................................10
A INICIALIZAO DE DREAMWEAVER .....................................................................10
REA DE TRABALHO DREAMWEAVER .....................................................................11
1.4.1. Criao de uma pgina em branco ...............................................................13
1.4.2. Viso Geral da rea de Trabalho.................................................................13
1.4.3. Viso Geral dos Menus ................................................................................16
1.5. O QUE NOVO NO DREAMWEAVER ..........................................................................17
1.5.1. Outros recursos importantes.........................................................................18
1.6. FECHAMENTO DE ARQUIVOS ....................................................................................19
1.7. A FINALIZAO DO DREAMWEAVER .......................................................................20
1.8. EXERCCIOS ..............................................................................................................20
2.
2.1.
2.2.
2.3.
2.4.
2.5.
A CRIAO DE UM NOVO SITE .................................................................................23

DEFINIO DE UM SITE LOCAL .................................................................................24
EDITANDO CONFIGURAES DE UM SITE DREAMWEAVER.......................................29
DEFINIO DE UM SITE REMOTO ..............................................................................30
DOCUMENTOS DO SITE .............................................................................................31
2.5.1. Criao de Documentos em Branco .............................................................32
2.5.2. Salvando um Documento .............................................................................33
2.5.3. Criao de um documento baseado em um arquivo predefinido .................36
2.5.4. Criao de um documento baseado em um Template .................................37
2.5.5. Abertura de documentos existentes .............................................................38
2.6. EXERCCIOS ..............................................................................................................39
3.
GERENCIAMENTO DO SITE DREAMWEAVER...............................................41
PROPRIEDADES DOS DOCUMENTOS ................................................................55

4.1. CORES WEB-SAFE ....................................................................................................55
4.2. CODIFICAO DO DOCUMENTO ................................................................................55
4.3. ESPECIFICANDO HTML EM LUGAR DE CSS .............................................................55
www.komedi.com.br
III
SITES DREAMWEAVER .........................................................................................23

2.1.
2.2.
2.3.
2.4.
2.5.
A CRIAO DE UM NOVO SITE .................................................................................23

DEFINIO DE UM SITE LOCAL .................................................................................24
EDITANDO CONFIGURAES DE UM SITE DREAMWEAVER.......................................29
DEFINIO DE UM SITE REMOTO ..............................................................................30
DOCUMENTOS DO SITE .............................................................................................31
2.5.1. Criao de Documentos em Branco .............................................................32
2.5.2. Salvando um Documento .............................................................................33
2.5.3. Criao de um documento baseado em um arquivo predefinido .................36
2.5.4. Criao de um documento baseado em um Template .................................37
2.5.5. Abertura de documentos existentes .............................................................38
2.6. EXERCCIOS ..............................................................................................................39
3.
3.1. ACESSO A SITES, SERVIDORES E DRIVES LOCAIS.......................................................41

3.1.1. Painel Files ...................................................................................................41
3.2. VISUALIZANDO ARQUIVOS E PASTAS........................................................................43
3.2.1. Arquivos no painel Files ..............................................................................44
3.2.2. Localizando arquivos no Site Dreamweaver ...............................................46
3.3. MAPA DO SITE ..........................................................................................................47
3.3.1. Visualizando um mapa do site .....................................................................47
3.3.2. Trabalho com pginas no mapa do site ........................................................48
3.3.3. Exibindo e ocultando arquivos no mapa do site ..........................................50
3.3.4. Salvando o mapa do site...............................................................................51
3.4. IMPORTANDO E EXPORTANDO SITES .........................................................................52
3.5. REMOO DE UM SITE DA LISTA DE SITES ................................................................53
3.6. EXERCCIOS ..............................................................................................................53
4.
O AMBIENTE ADOBE DREAMWEAVER CS3 .....................................................9
GERENCIAMENTO DO SITE DREAMWEAVER...............................................41

3.1. ACESSO A SITES, SERVIDORES E DRIVES LOCAIS.......................................................41
3.1.1. Painel Files ...................................................................................................41
3.2. VISUALIZANDO ARQUIVOS E PASTAS........................................................................43
3.2.1. Arquivos no painel Files ..............................................................................44
3.2.2. Localizando arquivos no Site Dreamweaver ...............................................46
3.3. MAPA DO SITE ..........................................................................................................47
3.3.1. Visualizando um mapa do site .....................................................................47
3.3.2. Trabalho com pginas no mapa do site ........................................................48
3.3.3. Exibindo e ocultando arquivos no mapa do site ..........................................50
3.3.4. Salvando o mapa do site...............................................................................51
3.4. IMPORTANDO E EXPORTANDO SITES .........................................................................52
3.5. REMOO DE UM SITE DA LISTA DE SITES ................................................................53
3.6. EXERCCIOS ..............................................................................................................53
4.
PROPRIEDADES DOS DOCUMENTOS ................................................................55

4.1. CORES WEB-SAFE ....................................................................................................55
4.2. CODIFICAO DO DOCUMENTO ................................................................................55
4.3. ESPECIFICANDO HTML EM LUGAR DE CSS .............................................................55
www.komedi.com.br
III
Adobe Dreamweaver CS3
4.3.1. Trabalho com Cores .................................................................................... 56

4.4. PROPRIEDADES DA PGINA ..................................................................................... 56
4.4.1. Ttulo do documento ................................................................................... 57
4.4.2. Definindo a imagem e a cor de fundo ......................................................... 58
4.4.3. Definindo cores padro de texto ................................................................. 59
4.4.4. Configurando estilos CSS de sublinhado de links ...................................... 59
4.5. VISUALIZAO DOS ELEMENTOS DA PGINA .......................................................... 60
4.6. EXERCCIOS ............................................................................................................. 61
5.
ADIO DE CONTEDO PGINA .................................................................. 63
4.3.1. Trabalho com Cores .................................................................................... 56

4.4. PROPRIEDADES DA PGINA ..................................................................................... 56
4.4.1. Ttulo do documento ................................................................................... 57
4.4.2. Definindo a imagem e a cor de fundo ......................................................... 58
4.4.3. Definindo cores padro de texto ................................................................. 59
4.4.4. Configurando estilos CSS de sublinhado de links ...................................... 59
4.5. VISUALIZAO DOS ELEMENTOS DA PGINA .......................................................... 60
4.6. EXERCCIOS ............................................................................................................. 61
5.
5.1. INSERO DE TEXTO................................................................................................ 63

5.1.1. Formatao do texto .................................................................................... 63
5.1.2. Aplicao de cor e estilo ............................................................................. 64
5.2. INSERO DE IMAGENS ........................................................................................... 65
5.2.1. Criao de uma imagem cambivel ............................................................ 67
5.3. VISUALIZAO DO DOCUMENTO ............................................................................. 68
5.4. INSERO DE TEXTO A PARTIR DE UM ARQUIVO...................................................... 69
5.4.1. Importao de um arquivo do Microsoft Word .......................................... 72
5.4.2. Importao de um arquivo do Microsoft Excel .......................................... 73
5.4.3. Cpia e colagem de trechos de arquivos Word e Excel .............................. 74
5.5. EXERCCIOS ............................................................................................................. 75
6.
LINKS E NAVEGAO........................................................................................... 77
5.1. INSERO DE TEXTO................................................................................................ 63

5.1.1. Formatao do texto .................................................................................... 63
5.1.2. Aplicao de cor e estilo ............................................................................. 64
5.2. INSERO DE IMAGENS ........................................................................................... 65
5.2.1. Criao de uma imagem cambivel ............................................................ 67
5.3. VISUALIZAO DO DOCUMENTO ............................................................................. 68
5.4. INSERO DE TEXTO A PARTIR DE UM ARQUIVO...................................................... 69
5.4.1. Importao de um arquivo do Microsoft Word .......................................... 72
5.4.2. Importao de um arquivo do Microsoft Excel .......................................... 73
5.4.3. Cpia e colagem de trechos de arquivos Word e Excel .............................. 74
5.5. EXERCCIOS ............................................................................................................. 75
6.
6.1. LOCALIZAO E CAMINHOS DOS

DOCUMENTOS............................................. 77
6.2. CRIANDO OS LINKS .................................................................................................. 78
6.3. VINCULAO DE DOCUMENTOS .............................................................................. 78
6.3.1. Vinculao de documentos a partir de textos.............................................. 81
6.4. TESTANDO A PGINA ............................................................................................... 84
6.5. LINKS PARA LOCAIS ESPECFICOS DE UM DOCUMENTO............................................ 84
6.6. CRIAO DE UM LINK DE CORREIO ELETRNICO ..................................................... 87
6.7. GERENCIAMENTO DOS LINKS................................................................................... 88
6.7.1. Criando e modificando os links no Site Map .............................................. 90
6.7.2. Alterao de um link no site inteiro ............................................................ 92
6.8. OS MENUS DE SALTO ............................................................................................... 92
6.8.1. Edio dos itens do menu de salto .............................................................. 94
6.9. EXERCCIOS ............................................................................................................. 95
7.
FORMATAO DE TEXTO ................................................................................... 97
www.komedi.com.br
LINKS E NAVEGAO........................................................................................... 77
6.1. LOCALIZAO E CAMINHOS DOS
DOCUMENTOS............................................. 77
6.2. CRIANDO OS LINKS .................................................................................................. 78
6.3. VINCULAO DE DOCUMENTOS .............................................................................. 78
6.3.1. Vinculao de documentos a partir de textos.............................................. 81
6.4. TESTANDO A PGINA ............................................................................................... 84
6.5. LINKS PARA LOCAIS ESPECFICOS DE UM DOCUMENTO............................................ 84
6.6. CRIAO DE UM LINK DE CORREIO ELETRNICO ..................................................... 87
6.7. GERENCIAMENTO DOS LINKS................................................................................... 88
6.7.1. Criando e modificando os links no Site Map .............................................. 90
6.7.2. Alterao de um link no site inteiro ............................................................ 92
6.8. OS MENUS DE SALTO ............................................................................................... 92
6.8.1. Edio dos itens do menu de salto .............................................................. 94
6.9. EXERCCIOS ............................................................................................................. 95
7.
7.1. AS LISTAS ................................................................................................................ 97

7.2. AS FOLHAS DE ESTILOS CSS .................................................................................... 98
7.2.1. Painel CSS Styles ........................................................................................ 98
7.2.2. Criao de um estilo CSS .......................................................................... 100
7.2.3. Folhas de estilos CSS externas .................................................................. 101
7.2.4. Aplicando um estilo CSS ao texto ............................................................ 105
7.2.5. Trabalhando com o painel CSS Style........................................................ 106
7.3. VERIFICAO ORTOGRFICA ................................................................................ 111
7.4. LOCALIZAO E SUBSTITUIO DE TEXTO ............................................................ 112
7.5. EXERCCIOS ........................................................................................................... 112
IV
ADIO DE CONTEDO PGINA .................................................................. 63
FORMATAO DE TEXTO ................................................................................... 97

7.1. AS LISTAS ................................................................................................................ 97
7.2. AS FOLHAS DE ESTILOS CSS .................................................................................... 98
7.2.1. Painel CSS Styles ........................................................................................ 98
7.2.2. Criao de um estilo CSS .......................................................................... 100
7.2.3. Folhas de estilos CSS externas .................................................................. 101
7.2.4. Aplicando um estilo CSS ao texto ............................................................ 105
7.2.5. Trabalhando com o painel CSS Style........................................................ 106
7.3. VERIFICAO ORTOGRFICA ................................................................................ 111
7.4. LOCALIZAO E SUBSTITUIO DE TEXTO ............................................................ 112
7.5. EXERCCIOS ........................................................................................................... 112
IV
www.komedi.com.br
ndice
8.
AUTOMATIZAO DE TAREFAS .....................................................................115
ndice
8.
8.1. USO DO PAINEL HISTORY .......................................................................................115

8.1.1. Automatizando tarefas ...............................................................................116
9.
O LAYOUT DE PGINA ........................................................................................121
AUTOMATIZAO DE TAREFAS .....................................................................115

8.1. USO DO PAINEL HISTORY .......................................................................................115
8.1.1. Automatizando tarefas ...............................................................................116
9.
O LAYOUT DE PGINA ........................................................................................121
9.1. LAYOUT DE PGINAS COM CSS .............................................................................121

9.2. BLOCOS DE CONTEDO ..........................................................................................121
9.2.1. Cor do destaque do bloco ...........................................................................123
9.2.2. Trabalhando com blocos de contedo........................................................123
9.3. CAMADAS NO DREAMWEAVER ..............................................................................124
9.3.1. Cdigo HTML das camadas ......................................................................124
9.3.2. Insero de camadas...................................................................................125
9.3.3. Camadas aninhadas ....................................................................................126
9.4. GERENCIANDO CAMADAS.......................................................................................127
9.4.1. Painel Layers ..............................................................................................128
9.4.2. Seleo de camadas ....................................................................................128
9.4.3. Preferncias da camada ..............................................................................129
9.4.4. Propriedades para uma camada nica ........................................................129
9.4.5. Propriedades de camadas mltiplas ...........................................................130
9.4.6. Trocando a ordem de empilhamento das camadas ....................................130
9.4.7. Mudando a visibilidade da camada ............................................................131
9.5. MANIPULANDO CAMADAS ......................................................................................132
9.5.1. Redimensionando camadas ........................................................................132
9.5.2. Movendo camadas......................................................................................133
9.5.3. Alinhando camadas ....................................................................................133
9.6. CONVERTENDO CAMADAS PARA TABELAS .............................................................133
9.6.1. Preveno de sobreposio ........................................................................133
9.6.2. Convertendo camadas e tabelas .................................................................134
9.1. LAYOUT DE PGINAS COM CSS .............................................................................121

9.2. BLOCOS DE CONTEDO ..........................................................................................121
9.2.1. Cor do destaque do bloco ...........................................................................123
9.2.2. Trabalhando com blocos de contedo........................................................123
9.3. CAMADAS NO DREAMWEAVER ..............................................................................124
9.3.1. Cdigo HTML das camadas ......................................................................124
9.3.2. Insero de camadas...................................................................................125
9.3.3. Camadas aninhadas ....................................................................................126
9.4. GERENCIANDO CAMADAS.......................................................................................127
9.4.1. Painel Layers ..............................................................................................128
9.4.2. Seleo de camadas ....................................................................................128
9.4.3. Preferncias da camada ..............................................................................129
9.4.4. Propriedades para uma camada nica ........................................................129
9.4.5. Propriedades de camadas mltiplas ...........................................................130
9.4.6. Trocando a ordem de empilhamento das camadas ....................................130
9.4.7. Mudando a visibilidade da camada ............................................................131
9.5. MANIPULANDO CAMADAS ......................................................................................132
9.5.1. Redimensionando camadas ........................................................................132
9.5.2. Movendo camadas......................................................................................133
9.5.3. Alinhando camadas ....................................................................................133
9.6. CONVERTENDO CAMADAS PARA TABELAS .............................................................133
9.6.1. Preveno de sobreposio ........................................................................133
9.6.2. Convertendo camadas e tabelas .................................................................134
10. TABELAS ..................................................................................................................135
10. TABELAS ..................................................................................................................135
10.1.1. Precedncia de Formatao em HTML .....................................................135

10.1.2. Diviso e Mesclagem de clulas de tabela .................................................135
10.2. INSERO DE TABELA E ADIO DE CONTEDO .....................................................136
10.2.1. Importao e exportao de dados tabulares .............................................137
10.3. SELEO DE ELEMENTOS DA TABELA ....................................................................139
10.3.1. Seleo de uma tabela ................................................................................139
10.3.2. Seleo de linhas ou colunas......................................................................140
10.3.3. Seleo de clulas ......................................................................................141
10.4. FORMATAO DE TABELAS E CLULAS ..................................................................142
10.4.1. Definio das propriedades da tabela ........................................................142
10.4.2. Definio das propriedades das colunas, linhas e clulas ..........................144
10.4.3. Usando um esquema de design para formatar uma tabela .........................146
10.5. REDIMENSIONANDO TABELAS, COLUNAS E LINHAS................................................147
10.5.1. Redimensionando uma tabela ....................................................................147
10.5.2. Redimensionando colunas e linhas ............................................................148
10.5.3. Tornando consistente a largura de cdigo com a largura visual ................148
10.5.4. Limpando larguras e alturas .......................................................................149
10.1.1. Precedncia de Formatao em HTML .....................................................135

10.1.2. Diviso e Mesclagem de clulas de tabela .................................................135
10.2. INSERO DE TABELA E ADIO DE CONTEDO .....................................................136
10.2.1. Importao e exportao de dados tabulares .............................................137
10.3. SELEO DE ELEMENTOS DA TABELA ....................................................................139
10.3.1. Seleo de uma tabela ................................................................................139
10.3.2. Seleo de linhas ou colunas......................................................................140
10.3.3. Seleo de clulas ......................................................................................141
10.4. FORMATAO DE TABELAS E CLULAS ..................................................................142
10.4.1. Definio das propriedades da tabela ........................................................142
10.4.2. Definio das propriedades das colunas, linhas e clulas ..........................144
10.4.3. Usando um esquema de design para formatar uma tabela .........................146
10.5. REDIMENSIONANDO TABELAS, COLUNAS E LINHAS................................................147
10.5.1. Redimensionando uma tabela ....................................................................147
10.5.2. Redimensionando colunas e linhas ............................................................148
10.5.3. Tornando consistente a largura de cdigo com a largura visual ................148
10.5.4. Limpando larguras e alturas .......................................................................149
www.komedi.com.br
www.komedi.com.br
10.6. ADIO E REMOO DE LINHAS E COLUNAS ......................................................... 149

10.6.1. Dividindo e Mesclando Clulas ................................................................ 150
10.6.2. Copiando, colando e deletando clulas ..................................................... 151
10.6.3. Tabelas aninhadas ..................................................................................... 153
10.6.4. Ordenao em tabelas................................................................................ 153
10.7. EXERCCIOS ........................................................................................................... 154
10.6. ADIO E REMOO DE LINHAS E COLUNAS ......................................................... 149

10.6.1. Dividindo e Mesclando Clulas ................................................................ 150
10.6.2. Copiando, colando e deletando clulas ..................................................... 151
10.6.3. Tabelas aninhadas ..................................................................................... 153
10.6.4. Ordenao em tabelas................................................................................ 153
10.7. EXERCCIOS ........................................................................................................... 154
11. FRAMES (MOLDURAS OU QUADROS) ............................................................ 157
11. FRAMES (MOLDURAS OU QUADROS) ............................................................ 157
11.1. FRAMES E FRAMESETS .......................................................................................... 157

11.1.1. Utilizao de frames .................................................................................. 157
11.1.2. Framesets aninhados ................................................................................. 158
11.2. TRABALHO COM FRAMESETS EM UMA JANELA DE DOCUMENTO............................ 158
11.3. CRIAO DE FRAMES E FRAMESETS ...................................................................... 158
11.3.1. Desenhando um frameset .......................................................................... 160
11.4. SELEO DE FRAMES E FRAMESETS....................................................................... 161
11.4.1. Seleo de frames e framesets na janela Document ................................. 162
11.4.2. Abertura de um Documento no Frame ...................................................... 163
11.4.3. Salvando frames e framesets ..................................................................... 164
11.4.4. Visualizao e configurao das propriedades e atributos do frame ........ 165
11.4.5. Visualizao e configurao das propriedades do frameset...................... 166
11.4.6. Controlando o contedo do frame ............................................................. 166
11.4.7. Browsers que no mostram frames ........................................................... 167
11.5. EXERCCIOS ........................................................................................................... 168
11.1. FRAMES E FRAMESETS .......................................................................................... 157

11.1.1. Utilizao de frames .................................................................................. 157
11.1.2. Framesets aninhados ................................................................................. 158
11.2. TRABALHO COM FRAMESETS EM UMA JANELA DE DOCUMENTO............................ 158
11.3. CRIAO DE FRAMES E FRAMESETS ...................................................................... 158
11.3.1. Desenhando um frameset .......................................................................... 160
11.4. SELEO DE FRAMES E FRAMESETS....................................................................... 161
11.4.1. Seleo de frames e framesets na janela Document ................................. 162
11.4.2. Abertura de um Documento no Frame ...................................................... 163
11.4.3. Salvando frames e framesets ..................................................................... 164
11.4.4. Visualizao e configurao das propriedades e atributos do frame ........ 165
11.4.5. Visualizao e configurao das propriedades do frameset...................... 166
11.4.6. Controlando o contedo do frame ............................................................. 166
11.4.7. Browsers que no mostram frames ........................................................... 167
11.5. EXERCCIOS ........................................................................................................... 168
12. OS FORMULRIOS ............................................................................................... 169
12. OS FORMULRIOS ............................................................................................... 169
12.1. OS SCRIPTS CGI .................................................................................................... 169

12.2. OS OBJETOS DE FORMULRIO ................................................................................ 169
12.3. CRIAO DE UM FORMULRIO .............................................................................. 170
12.4. OS CAMPOS DE FORMULRIO................................................................................. 172
12.4.1. Criao de campos de texto....................................................................... 172
12.4.2. Criao de um campo oculto ..................................................................... 174
12.5. CAIXAS DE SELEO E BOTES DE OPO ............................................................. 175
12.5.1. Caixas de seleo ...................................................................................... 175
12.5.2. Botes de opo ........................................................................................ 176
12.6. AS LISTAS E OS MENUS .......................................................................................... 177
12.6.1. Criao de uma lista de rolagem ............................................................... 177
12.6.2. Criao de um menu pop-up ..................................................................... 179
12.7. OS BOTES DE FORMULRIO ................................................................................. 180
12.8. UTILIZANDO OS COMPORTAMENTOS COM FORMULRIOS ..................................... 181
12.9. EXERCCIOS ........................................................................................................... 183
12.1. OS SCRIPTS CGI .................................................................................................... 169

12.2. OS OBJETOS DE FORMULRIO ................................................................................ 169
12.3. CRIAO DE UM FORMULRIO .............................................................................. 170
12.4. OS CAMPOS DE FORMULRIO................................................................................. 172
12.4.1. Criao de campos de texto....................................................................... 172
12.4.2. Criao de um campo oculto ..................................................................... 174
12.5. CAIXAS DE SELEO E BOTES DE OPO ............................................................. 175
12.5.1. Caixas de seleo ...................................................................................... 175
12.5.2. Botes de opo ........................................................................................ 176
12.6. AS LISTAS E OS MENUS .......................................................................................... 177
12.6.1. Criao de uma lista de rolagem ............................................................... 177
12.6.2. Criao de um menu pop-up ..................................................................... 179
12.7. OS BOTES DE FORMULRIO ................................................................................. 180
12.8. UTILIZANDO OS COMPORTAMENTOS COM FORMULRIOS ..................................... 181
12.9. EXERCCIOS ........................................................................................................... 183
13. INSERO DE MDIA........................................................................................... 185
13. INSERO DE MDIA........................................................................................... 185
13.1.
13.2.
13.3.
13.4.
13.5.
13.6.
VI
INSERO DE OBJETOS DE MDIA ........................................................................... 185

ARQUIVOS FLASH .................................................................................................. 185
OS OBJETOS DE BOTO FLASH ............................................................................... 186
OS OBJETOS DE TEXTO FLASH ............................................................................... 189
INSERO DE FILMES FLASH ................................................................................. 191
INSERO DE FILMES SHOCKWAVE ....................................................................... 192
www.komedi.com.br
13.1.
13.2.
13.3.
13.4.
13.5.
13.6.
VI
INSERO DE OBJETOS DE MDIA ........................................................................... 185

ARQUIVOS FLASH .................................................................................................. 185
OS OBJETOS DE BOTO FLASH ............................................................................... 186
OS OBJETOS DE TEXTO FLASH ............................................................................... 189
INSERO DE FILMES FLASH ................................................................................. 191
INSERO DE FILMES SHOCKWAVE ....................................................................... 192
www.komedi.com.br
ndice
ndice
13.7. ADIO DE SOM A UMA PGINA .............................................................................192

13.7.1. Vinculao a um arquivo de udio.............................................................193
13.7.2. Incorporando udio ....................................................................................193
13.7. ADIO DE SOM A UMA PGINA .............................................................................192

13.7.1. Vinculao a um arquivo de udio.............................................................193
13.7.2. Incorporando udio ....................................................................................193
14. EDIO DE HTML NO DREAMWEAVER ........................................................195
14. EDIO DE HTML NO DREAMWEAVER ........................................................195
14.1. OS TAGS HTML BSICOS .......................................................................................195

14.2. INSERINDO COMENTRIOS......................................................................................196
14.1. OS TAGS HTML BSICOS .......................................................................................195

14.2. INSERINDO COMENTRIOS......................................................................................196
15. TESTE E PUBLICAO DE UM SITE ................................................................199
15. TESTE E PUBLICAO DE UM SITE ................................................................199
15.1. VERIFICAO DA COMPATIBILIDADE COM O NAVEGADOR .....................................200

15.2. VERIFICAO DOS LINKS NUMA PGINA OU SITE ...................................................202
15.2.1. Ajuste de links rompidos............................................................................204
15.2.2. Abrindo documentos vinculados no Dreamweaver ...................................204
15.3. UTILIZAO DE RELATRIOS PARA TESTAR UM SITE .............................................205
15.4. DOWNLOAD E UPLOAD DE ARQUIVOS ....................................................................206
15.4.1. Download de arquivos de um servidor remoto ..........................................207
15.4.2. Upload de arquivos em um servidor remoto ..............................................208
15.4.3. Sincronizao dos arquivos........................................................................209
15.4.4. Registro de atividades de transferncia......................................................210
15.1. VERIFICAO DA COMPATIBILIDADE COM O NAVEGADOR .....................................200

15.2. VERIFICAO DOS LINKS NUMA PGINA OU SITE ...................................................202
15.2.1. Ajuste de links rompidos............................................................................204
15.2.2. Abrindo documentos vinculados no Dreamweaver ...................................204
15.3. UTILIZAO DE RELATRIOS PARA TESTAR UM SITE .............................................205
15.4. DOWNLOAD E UPLOAD DE ARQUIVOS ....................................................................206
15.4.1. Download de arquivos de um servidor remoto ..........................................207
15.4.2. Upload de arquivos em um servidor remoto ..............................................208
15.4.3. Sincronizao dos arquivos........................................................................209
15.4.4. Registro de atividades de transferncia......................................................210
www.komedi.com.br
VII
www.komedi.com.br
VII
VIII
www.komedi.com.br
VIII
www.komedi.com.br
O Ambiente Adobe Dreamweaver CS3
1.
1.
Adobe Dreamweaver CS3 um editor profissional de HTML utilizado para projetar, codificar e
desenvolver Pginas, Sites e Aplicaes Web.
Tanto para controle manual do cdigo HTML como para operao em um ambiente de edio
visual, Dreamweaver oferece ferramentas teis para otimizar seu trabalho de criao de sites para
Internet.
Alm disso, Dreamweaver pode ajud-lo a construir aplicaes dinmicas para Internet, utilizando
banco de dados, com desenvolvimento nas linguagens de servidor, como ASP, ASP.NET,
ColdFusion, JSP e PHP.
Adobe Dreamweaver CS3 um editor profissional de HTML utilizado para projetar, codificar e
desenvolver Pginas, Sites e Aplicaes Web.
Tanto para controle manual do cdigo HTML como para operao em um ambiente de edio
visual, Dreamweaver oferece ferramentas teis para otimizar seu trabalho de criao de sites para
Internet.
Alm disso, Dreamweaver pode ajud-lo a construir aplicaes dinmicas para Internet, utilizando
banco de dados, com desenvolvimento nas linguagens de servidor, como ASP, ASP.NET,
ColdFusion, JSP e PHP.
1.1.
1.1.
Instalao do Dreamweaver
Antes de instalar Dreamweaver, certifique-se de que seu computador possui o seguinte hardware e
software:
Processador Intel Pentium 4, Intel Centrino Intel Xeon, ou Intel Core Duo (ou
compatvel).
Microsoft Windows XP com Service Pack 2 ou Windows Vista Home Premium, Business,
Ultimate, ou Enterprise (certificado para edies de 32-bit).
Pelo menos 512 MB de memria RAM disponvel (1 GB recomendados).
Pelo menos 1 GB de espao disponvel em disco ( necessrio um espao adicional durante a
instalao).
Monitor com resoluo de 1024 x 768, 16-bits (32-bits recomendvel) ou superior.
Software QuickTime 7, necessrio para recursos de multimdia.
Ligao Internet, necessria para ativao do produto.
Antes de instalar Dreamweaver, certifique-se de que seu computador possui o seguinte hardware e
software:
Processador Intel Pentium 4, Intel Centrino Intel Xeon, ou Intel Core Duo (ou
compatvel).
Microsoft Windows XP com Service Pack 2 ou Windows Vista Home Premium, Business,
Ultimate, ou Enterprise (certificado para edies de 32-bit).
Pelo menos 512 MB de memria RAM disponvel (1 GB recomendados).
Pelo menos 1 GB de espao disponvel em disco ( necessrio um espao adicional durante a
instalao).
Monitor com resoluo de 1024 x 768, 16-bits (32-bits recomendvel) ou superior.
Software QuickTime 7, necessrio para recursos de multimdia.
Ligao Internet, necessria para ativao do produto.
Para instalar Dreamweaver:
Para instalar Dreamweaver:
1.
1.
2.
3.
4.
5.
Instalao do Dreamweaver
Insira o CD do Dreamweaver na unidade de CD-ROM de seu computador. O

programa se inicia automaticamente.
Clique no cone de instalao Dreamweaver CS3.
Clique no boto Install
Siga as instrues de instalao. O programa de instalao solicitar as
informaes necessrias.
Ao final da instalao, se solicitado, reinicie seu computador.
5.
Adobe Dreamweaver CS3 nome oficial do programa, mas, ao longo desse ,texto, ser denominado
simplesmente de Dreamweaver.
www.komedi.com.br
2.
3.
4.
Insira o CD do Dreamweaver na unidade de CD-ROM de seu computador. O

programa se inicia automaticamente.
Clique no cone de instalao Dreamweaver CS3.
Clique no boto Install
Siga as instrues de instalao. O programa de instalao solicitar as
informaes necessrias.
Ao final da instalao, se solicitado, reinicie seu computador.
Adobe Dreamweaver CS3 nome oficial do programa, mas, ao longo desse ,texto, ser denominado
simplesmente de Dreamweaver.
www.komedi.com.br
1.2.
1.2.
Arquivos Utilizados na Apostila
Arquivos Utilizados na Apostila
Durante o desenvolvimento do curso sero utilizadas imagens e textos para construo de um site
demonstrativo, alm de imagens fornecidas na instalao do programa, para exemplificao dos
passos de desenvolvimento.
Os arquivos necessrios para a construo do site podem ser obtidos por meio de download no
endereo www.komedi.com.br/download/DWVCS3.Zip. Aps o download, os arquivos devem ser
descompactados e salvos em uma pasta denominada Site no diretrio designado para o aluno.
Localize em seu computador, a pasta que contm arquivos de imagem do programa: C:\Arquivos de
programas\Adobe\Dreamweaver CS3\Tutorial_assets\cafe_townsend\images.
Durante o desenvolvimento do curso sero utilizadas imagens e textos para construo de um site
demonstrativo, alm de imagens fornecidas na instalao do programa, para exemplificao dos
passos de desenvolvimento.
Os arquivos necessrios para a construo do site podem ser obtidos por meio de download no
endereo www.komedi.com.br/download/DWVCS3.Zip. Aps o download, os arquivos devem ser
descompactados e salvos em uma pasta denominada Site no diretrio designado para o aluno.
Localize em seu computador, a pasta que contm arquivos de imagem do programa: C:\Arquivos de
programas\Adobe\Dreamweaver CS3\Tutorial_assets\cafe_townsend\images.
Nota: Mesmo sem acesso a estes arquivos, os exemplos podem ser compreendidos e realizados com
outros arquivos (imagens e textos) de seu prprio computador.
Nota: Mesmo sem acesso a estes arquivos, os exemplos podem ser compreendidos e realizados com
outros arquivos (imagens e textos) de seu prprio computador.
1.3.
1.3.
A Inicializao de Dreamweaver
Dreamweaver inicializado dentro do Windows. Ao carregar o Windows, os cones de atalho que

voc definiu estaro dispostos na tela.
Para carregar Dreamweaver voc pode usar um atalho ou procur-lo no menu Iniciar.
10
A Inicializao de Dreamweaver
Dreamweaver inicializado dentro do Windows. Ao carregar o Windows, os cones de atalho que

voc definiu estaro dispostos na tela.
Para carregar Dreamweaver voc pode usar um atalho ou procur-lo no menu Iniciar.
Para carregar Dreamweaver atravs de um atalho:
Para carregar Dreamweaver atravs de um atalho:
1.
1.
D um duplo-clique sobre o cone do atalho, Figura 1. O programa ser

inicializado.
D um duplo-clique sobre o cone do atalho, Figura 1. O programa ser

inicializado.
Figura 1 Atalho de Dreamweaver
Figura 1 Atalho de Dreamweaver
Para carregar Dreamweaver atravs do menu Iniciar:
Para carregar Dreamweaver atravs do menu Iniciar:
1.
2.
3.
4.
1.
2.
3.
4.
Na barra de tarefas, clique no boto Iniciar.

Aponte para a opo Todos os Programas.
Aponte para a opo Adobe Design Premium CS3.
Clique na opo Adobe Dreamweaver CS3, Figura 2. O programa ser
inicializado.
www.komedi.com.br
10
Na barra de tarefas, clique no boto Iniciar.

Aponte para a opo Todos os Programas.
Aponte para a opo Adobe Design Premium CS3.
Clique na opo Adobe Dreamweaver CS3, Figura 2. O programa ser
inicializado.
www.komedi.com.br
Figura 2 Carregar Dreamweaver atravs do menu Iniciar
1.4.
Figura 2 Carregar Dreamweaver atravs do menu Iniciar
rea de Trabalho Dreamweaver
1.4.
No Windows, Dreamweaver oferece uma rea de Trabalho nica, na qual todas as janelas e painis
so integrados em uma nica grande janela do aplicativo, permitindo a observao das propriedades
de documentos e objetos.
Voc pode escolher entre um layout orientado ao design ou s necessidades de programao manuais.
Ao abrir o programa pela primeira vez, mostrada uma caixa de dilogo que permite a escolha de um
layout da rea de Trabalho. Uma posterior alterao pode ser feita utilizando a caixa de dilogo
Preferences.
rea de Trabalho Dreamweaver
No Windows, Dreamweaver oferece uma rea de Trabalho nica, na qual todas as janelas e painis
so integrados em uma nica grande janela do aplicativo, permitindo a observao das propriedades
de documentos e objetos.
Voc pode escolher entre um layout orientado ao design ou s necessidades de programao manuais.
Ao abrir o programa pela primeira vez, mostrada uma caixa de dilogo que permite a escolha de um
layout da rea de Trabalho. Uma posterior alterao pode ser feita utilizando a caixa de dilogo
Preferences.
Para selecionar o layout da rea de Trabalho:
Para selecionar o layout da rea de Trabalho:
1.
1.
Abra o programa Dreamweaver. Se esta for a primeira utilizao do programa,

ser aberta a caixa de dilogo Workspace Setup, Figura 3.
Abra o programa Dreamweaver. Se esta for a primeira utilizao do programa,

ser aberta a caixa de dilogo Workspace Setup, Figura 3.
Figura 3 Seleo de layout da rea de Trabalho
Figura 3 Seleo de layout da rea de Trabalho
As opes disponveis so:

Designer workspace rea de Trabalho na qual a janela Document e os painis so integrados
dentro de uma janela de aplicao maior, com os grupos de painis localizados direita. o layout
recomendado para a maioria dos usurios e a maioria dos textos da apostila assumir esta forma de
visualizao.
Coder workspace rea de Trabalho com o grupo de painis esquerda. A janela Document
mostra a visualizao de cdigo como padro. recomendado para programadores j acostumados a
este tipo de visualizao.
As opes disponveis so:

Designer workspace rea de Trabalho na qual a janela Document e os painis so integrados
dentro de uma janela de aplicao maior, com os grupos de painis localizados direita. o layout
recomendado para a maioria dos usurios e a maioria dos textos da apostila assumir esta forma de
visualizao.
Coder workspace rea de Trabalho com o grupo de painis esquerda. A janela Document
mostra a visualizao de cdigo como padro. recomendado para programadores j acostumados a
este tipo de visualizao.
www.komedi.com.br
11
www.komedi.com.br
11

2.
3.
Clique na caixa de opo Designer, para ativ-la, para selecionar o layout

Designer workspace. Este ser o modo de trabalho que utilizaremos ao longo do
texto.
Clique no boto OK. Ser aberta a rea de Trabalho, Figura 4.
2.
3.
Clique na caixa de opo Designer, para ativ-la, para selecionar o layout

Designer workspace. Este ser o modo de trabalho que utilizaremos ao longo do
texto.
Clique no boto OK. Ser aberta a rea de Trabalho, Figura 4.
Figura 4 rea de Trabalho, com Start Page
Figura 4 rea de Trabalho, com Start Page
A pgina Start Page permite a abertura de documentos recentes ou a criao de um novo

documento, alm de fornecer um caminho para acesso ao tutorial do programa. No utilizaremos esta
pgina nesta apostila.
A pgina Start Page permite a abertura de documentos recentes ou a criao de um novo

documento, alm de fornecer um caminho para acesso ao tutorial do programa. No utilizaremos esta
pgina nesta apostila.
4.
5.
12
Se a pgina Start Page estiver aberta, clique na caixa de verificao Dont

show again, para fech-la. Ser aberta uma caixa de alerta informando o
procedimento para exibir a pgina novamente, se desejado, como mostrado na
Figura 5.
4.
Figura 5 Caixa de alerta para fechamento da Start Page

Clique no boto OK. A pgina Start Page no mais ser aberta quando da
prxima execuo do programa.
www.komedi.com.br
5.
12
Se a pgina Start Page estiver aberta, clique na caixa de verificao Dont

show again, para fech-la. Ser aberta uma caixa de alerta informando o
procedimento para exibir a pgina novamente, se desejado, como mostrado na
Figura 5.
Figura 5 Caixa de alerta para fechamento da Start Page

Clique no boto OK. A pgina Start Page no mais ser aberta quando da
prxima execuo do programa.
www.komedi.com.br
1.4.1. Criao de uma pgina em branco
1.4.1. Criao de uma pgina em branco
Vamos criar uma pgina em branco, para podermos observar todos os elementos da rea de
Trabalho. Mais adiante explicaremos com mais detalhes os procedimentos de criao e abertura de
arquivos.
Vamos criar uma pgina em branco, para podermos observar todos os elementos da rea de
Trabalho. Mais adiante explicaremos com mais detalhes os procedimentos de criao e abertura de
arquivos.
Para criar um documento:
Para criar um documento:
1.
1.
2.
3.
No menu File, clique no comando New. Ser aberta a caixa de dilogo New
Document.
No altere nada nesta caixa de dilogo, como mostrado na Figura 6.
Clique no boto Create. Ser aberta uma pgina em branco, na rea de
Trabalho.
2.
3.
No menu File, clique no comando New. Ser aberta a caixa de dilogo New
Document.
No altere nada nesta caixa de dilogo, como mostrado na Figura 6.
Clique no boto Create. Ser aberta uma pgina em branco, na rea de
Trabalho.
Figura 6 Caixa de dilogo New Document
Figura 6 Caixa de dilogo New Document
1.4.2. Viso Geral da rea de Trabalho
1.4.2. Viso Geral da rea de Trabalho
Esta seo descreve brevemente alguns elementos da rea de Trabalho do programa, os quais sero
utilizados e descritos com mais detalhes ao longo da apostila.
Esta seo descreve brevemente alguns elementos da rea de Trabalho do programa, os quais sero
utilizados e descritos com mais detalhes ao longo da apostila.
www.komedi.com.br
13
www.komedi.com.br
13
Figura 7 Viso Geral da rea de Trabalho

Principais elementos da rea de Trabalho:
Barra Insert contm botes para insero de vrios tipos de
objetos (trecho de cdigo HTML) no documento como, por
exemplo, imagens, tabelas, camadas etc. Como alternativa, o
mesmo processo pode ser efetuado atravs do menu Insert.
Esta barra possui diferentes categorias, de acordo com o tipo de
elemento a ser aplicado ao documento. Estas categorias podem
ser selecionadas na caixa de lista, mostrada na Figura 8, que
aberta ao clicar no tringulo invertido ( ), ao lado do nome da
barra.
As barras so mostradas abaixo, com seus cones diferenciados:
14
Figura 7 Viso Geral da rea de Trabalho
Figura 8 Categorias da
barra Insert
www.komedi.com.br
Principais elementos da rea de Trabalho:

Barra Insert contm botes para insero de vrios tipos de
objetos (trecho de cdigo HTML) no documento como, por
exemplo, imagens, tabelas, camadas etc. Como alternativa, o
mesmo processo pode ser efetuado atravs do menu Insert.
Esta barra possui diferentes categorias, de acordo com o tipo de
elemento a ser aplicado ao documento. Estas categorias podem
ser selecionadas na caixa de lista, mostrada na Figura 8, que
aberta ao clicar no tringulo invertido ( ), ao lado do nome da
barra.
As barras so mostradas abaixo, com seus cones diferenciados:
14
Figura 8 Categorias da
barra Insert
www.komedi.com.br
Figura 9 Categorias da Barra Insert
Figura 9 Categorias da Barra Insert
Para mostrar a barra como um conjunto de guias encaixadas:
Para mostrar a barra como um conjunto de guias encaixadas:
1.
1.
Clique na seta ao lado do nome de qualquer barra e clique no comando Show as

Tabs.
Clique na seta ao lado do nome de qualquer barra e clique no comando Show as

Tabs.
Figura 10 Barra Insert mostrada como um conjunto de guias encaixadas
Figura 10 Barra Insert mostrada como um conjunto de guias encaixadas
Para voltar a mostrar a barra como um conjunto menus:
Para voltar a mostrar a barra como um conjunto menus:
1.
1.
Clique na seta ao lado do nome de qualquer barra, com o boto direito do mouse, e
clique no comando Show as Menus.
Clique na seta ao lado do nome de qualquer barra, com o boto direito do mouse, e
clique no comando Show as Menus.
Barra de Ferramentas Document contm botes que permitem trocar a forma de visualizao
do documento, que so: Code, Design e Split (as duas visualizaes simultneas), alm de
comandos e opes relacionadas a outras de visualizao do documento e de transferncia entre o site
local e remoto.
Barra de Ferramentas Standard contm botes para operaes bsicas dos menus File e
Edit. So eles: New, Open, Save, Save All, Print Code, Cut, Copy, Paste, Undo
e Redo, que operam de forma idntica dos correspondentes comandos dos menus.
Barra de Ferramentas Document contm botes que permitem trocar a forma de visualizao
do documento, que so: Code, Design e Split (as duas visualizaes simultneas), alm de
comandos e opes relacionadas a outras de visualizao do documento e de transferncia entre o site
local e remoto.
Barra de Ferramentas Standard contm botes para operaes bsicas dos menus File e
Edit. So eles: New, Open, Save, Save All, Print Code, Cut, Copy, Paste, Undo
e Redo, que operam de forma idntica dos correspondentes comandos dos menus.
Figura 11 Barra Standard mostrada como um conjunto de guias encaixadas
Figura 11 Barra Standard mostrada como um conjunto de guias encaixadas
Barra de Status localizada no rodap da janela Document, proporciona informaes adicionais

sobre o documento aberto, como seletor de Tag (que mostra a hierarquia das tags selecionadas),
caixa de lista Window Size (visvel no modo Design, para redimensionar o documento), tempo e
tamanho estimados de download.
Janela Document mostra o documento atual quando criado ou editado.
Inspetor Properties mostra e permite a alterao de propriedades de textos ou objetos
selecionados. Como cada objeto possui diferentes propriedades, o inspetor Properties
diferenciado conforme o objeto selecionado.
Grupo de Painis conjunto de painis semelhantes agrupados sob um ttulo. O grupo de painis
inicialmente alocado em conjunto, mas os painis podem ser deslocados para suas prprias janelas.
Painel Files permite o gerenciamento de arquivos e pastas, quer eles sejam parte de um Site
Dreamweaver ou estejam em um servidor remoto. Tambm acessa os arquivos no disco local de
forma semelhante ao Windows Explorer.
Barra de Status localizada no rodap da janela Document, proporciona informaes adicionais

sobre o documento aberto, como seletor de Tag (que mostra a hierarquia das tags selecionadas),
caixa de lista Window Size (visvel no modo Design, para redimensionar o documento), tempo e
tamanho estimados de download.
Janela Document mostra o documento atual quando criado ou editado.
Inspetor Properties mostra e permite a alterao de propriedades de textos ou objetos
selecionados. Como cada objeto possui diferentes propriedades, o inspetor Properties
diferenciado conforme o objeto selecionado.
Grupo de Painis conjunto de painis semelhantes agrupados sob um ttulo. O grupo de painis
inicialmente alocado em conjunto, mas os painis podem ser deslocados para suas prprias janelas.
Painel Files permite o gerenciamento de arquivos e pastas, quer eles sejam parte de um Site
Dreamweaver ou estejam em um servidor remoto. Tambm acessa os arquivos no disco local de
forma semelhante ao Windows Explorer.
www.komedi.com.br
15
www.komedi.com.br
15
1.4.3. Viso Geral dos Menus
1.4.3. Viso Geral dos Menus
Figura 12 Menus e Submenus
Figura 12 Menus e Submenus
File Menu contm os itens de menu padro para tratamento de arquivos, como New, Open,
Close, Close All, Save, Save As, Save All, Revert, assim como comandos para
visualizao e ao sobre o documento atual, como Print Code, Import, Export, Convert,
Preview in Browser etc.
Edit Menu contm os itens de menu padro para edio de arquivos, como Cut, Copy, Past,
Undo e Redo, alm de comandos de seleo e busca, como Select Parent Tag, Find and
Replace, Preferences.
View menu permite a visualizao do documento de vrias formas (como Design, Code,
Code and Design) e a exibio ou ocultao de vrios elementos da pgina e de barras de
ferramentas do programa.
Insert menu caminho alternativo para a Insert bar, para inserir objetos no documento.
Modify menu permite alteraes das propriedades dos elementos selecionados nas pginas, tais
como edio de atributos de tag, alteraes de tabelas e seus elementos, alm de aes sobre itens de
2
biblioteca e de Templates .
Text menu realiza formatao de texto de forma fcil.
Commands menu fornece acesso a vrios comandos, tais como formatao de cdigo
personalizada, criao de lbum de fotos e otimizao de imagens pelo uso do Adobe Fireworks.
Site menu apresenta itens de menu para gerenciamento de sites e transferncia de arquivos com o
provedor de Internet.
Window menu fornece acesso a todos os painis, inspetores e janelas do programa.
Help menu fornece acesso documentao do programa, sistema de ajuda para uso do programa e
manual de referncia para linguagens.
File Menu contm os itens de menu padro para tratamento de arquivos, como New, Open,
Close, Close All, Save, Save As, Save All, Revert, assim como comandos para
visualizao e ao sobre o documento atual, como Print Code, Import, Export, Convert,
Preview in Browser etc.
Edit Menu contm os itens de menu padro para edio de arquivos, como Cut, Copy, Past,
Undo e Redo, alm de comandos de seleo e busca, como Select Parent Tag, Find and
Replace, Preferences.
View menu permite a visualizao do documento de vrias formas (como Design, Code,
Code and Design) e a exibio ou ocultao de vrios elementos da pgina e de barras de
ferramentas do programa.
Insert menu caminho alternativo para a Insert bar, para inserir objetos no documento.
Modify menu permite alteraes das propriedades dos elementos selecionados nas pginas, tais
como edio de atributos de tag, alteraes de tabelas e seus elementos, alm de aes sobre itens de
2
biblioteca e de Templates .
Text menu realiza formatao de texto de forma fcil.
Commands menu fornece acesso a vrios comandos, tais como formatao de cdigo
personalizada, criao de lbum de fotos e otimizao de imagens pelo uso do Adobe Fireworks.
Site menu apresenta itens de menu para gerenciamento de sites e transferncia de arquivos com o
provedor de Internet.
Window menu fornece acesso a todos os painis, inspetores e janelas do programa.
Help menu fornece acesso documentao do programa, sistema de ajuda para uso do programa e
manual de referncia para linguagens.
Templates so modelos predefinidos de formatao de pginas HTML.
16
www.komedi.com.br
Templates so modelos predefinidos de formatao de pginas HTML.
16
www.komedi.com.br
1.5.
O que novo no Dreamweaver
1.5.
O que novo no Dreamweaver
Dreamweaver contm uma nova interface enxuta, associada com uma performance otimizada. H
uma grande variedade de aspectos que facilitam a utilizao, auxiliando a construo de pginas, nos
dois modos de exibio. O programa torna simples e acessveias tecnologias complexas, permitindo
que voc realize mais em menos tempo.
Dreamweaver contm uma nova interface enxuta, associada com uma performance otimizada. H
uma grande variedade de aspectos que facilitam a utilizao, auxiliando a construo de pginas, nos
dois modos de exibio. O programa torna simples e acessveias tecnologias complexas, permitindo
que voc realize mais em menos tempo.
Novos Recursos:
Quadro gil para Ajax com o Adobe Dreamweaver CS3, voc pode visualmente conceber,
desenvolver e implantar interfaces dinmicas para usurios usando o quadro de Ajax. O quadro para
o Ajax uma biblioteca JavaScript para web designers que permite aos desenvolvedores criarem
pginas que oferecem uma experincia mais rica para os seus utilizadores.
Componentes gis so components de interface para usurios comuns que voc pode customizar
usando CSS, e, ento, adicionar s suas pginas web. Com o Dreamweaver, voc pode adicionar um
nmero de Componentes gis s suas pginas, incluindo XML-listas orientadas e tabelas, interfaces
com tabulao, elementos de formulrio com validao etc.
Efeitos Rpidos so uma forma simples e elegante de melhorar a aparncia do seu site. Voc pode
aplic-los para praticamente qualquer elemento em uma pgina HTML. Voc pode adicionar efeitos
rpidos para aumentar, encolher, ocultar e destacar elementos; visualmente alterar um elemento de
pgina para um determinado perodo de tempo e muito mais.
Avanada integrao com o Photoshop CS3 agora, os projetistas podem simplesmente selecionar
qualquer parte de um desenho no Photoshop, mesmo atravs de mltiplas camadas, e col-lo
diretamente em uma pgina Dreamweaver. Dreamweaver apresenta uma caixa de dilogo onde voc
pode especificar opes para a otimizao da imagem. Se voc alguma vez precisar editar a imagem,
simplesmente d um duplo-clique na imagem para abrir o arquivo original PSD do Photoshop para
edio.
Verificao de Compatibilidade de Browser a nova funcionalidade gera relatrios que
identificam tags CSS relacionadas com a apresentao em uma variedade de navegadores. No modo
Code View, as tags so sinalizadas com verde sublinhando, assim voc sabe exatamente onde est
o problema. Depois de identificar o problema, voc pode corrigi-lo rapidamente se voc souber a
soluo, ou, se voc precisar de mais informaes, pode visitar o Adobe CSS Orientador.
Adobe CSS Orientador contm informaes sobre as ltimas questes sobre CSS e acessvel
diretamente a partir da interface do usurio durante o processo de verificao de Compatibilidade de
Browser. Mais que um frum, uma pgina wiki ou um grupo de discusso, o CSS Orientador torna
fcil para voc realizar comentrios com sugestes e melhorias no contedo existente ou adicionar
novas questes para o benefcio de toda a comunidade.
CSS Layouts o Dreamwaver oferece agora uma lista abrangente de desenhos essenciais que voc
pode personalizar para atender s suas necessidades atravs de layouts CSS predefinidos.
Gerenciamento CSS esta caracterstica torna mais fcil para voc mover regras CSS de documento
para documento, desde o cabealho de um documento at uma folha externa e muito mais. Voc pode
tambm coloc-las onde voc precisar, apenas arrastando e soltando.
Adobe Device Central integrado com o Dreamweaver, bem como toda a famlia de software
Creative Suite 3, o Adobe Device Central simplifica a criao de contedos mveis, dando-lhe a
possibilidade de acessar rapidamente especificaes tcnicas essenciais de cada dispositivo, bem
como diminuir o texto e as imagens da sua pgina HTML.
Novos Recursos:
Quadro gil para Ajax com o Adobe Dreamweaver CS3, voc pode visualmente conceber,
desenvolver e implantar interfaces dinmicas para usurios usando o quadro de Ajax. O quadro para
o Ajax uma biblioteca JavaScript para web designers que permite aos desenvolvedores criarem
pginas que oferecem uma experincia mais rica para os seus utilizadores.
Componentes gis so components de interface para usurios comuns que voc pode customizar
usando CSS, e, ento, adicionar s suas pginas web. Com o Dreamweaver, voc pode adicionar um
nmero de Componentes gis s suas pginas, incluindo XML-listas orientadas e tabelas, interfaces
com tabulao, elementos de formulrio com validao etc.
Efeitos Rpidos so uma forma simples e elegante de melhorar a aparncia do seu site. Voc pode
aplic-los para praticamente qualquer elemento em uma pgina HTML. Voc pode adicionar efeitos
rpidos para aumentar, encolher, ocultar e destacar elementos; visualmente alterar um elemento de
pgina para um determinado perodo de tempo e muito mais.
Avanada integrao com o Photoshop CS3 agora, os projetistas podem simplesmente selecionar
qualquer parte de um desenho no Photoshop, mesmo atravs de mltiplas camadas, e col-lo
diretamente em uma pgina Dreamweaver. Dreamweaver apresenta uma caixa de dilogo onde voc
pode especificar opes para a otimizao da imagem. Se voc alguma vez precisar editar a imagem,
simplesmente d um duplo-clique na imagem para abrir o arquivo original PSD do Photoshop para
edio.
Verificao de Compatibilidade de Browser a nova funcionalidade gera relatrios que
identificam tags CSS relacionadas com a apresentao em uma variedade de navegadores. No modo
Code View, as tags so sinalizadas com verde sublinhando, assim voc sabe exatamente onde est
o problema. Depois de identificar o problema, voc pode corrigi-lo rapidamente se voc souber a
soluo, ou, se voc precisar de mais informaes, pode visitar o Adobe CSS Orientador.
Adobe CSS Orientador contm informaes sobre as ltimas questes sobre CSS e acessvel
diretamente a partir da interface do usurio durante o processo de verificao de Compatibilidade de
Browser. Mais que um frum, uma pgina wiki ou um grupo de discusso, o CSS Orientador torna
fcil para voc realizar comentrios com sugestes e melhorias no contedo existente ou adicionar
novas questes para o benefcio de toda a comunidade.
CSS Layouts o Dreamwaver oferece agora uma lista abrangente de desenhos essenciais que voc
pode personalizar para atender s suas necessidades atravs de layouts CSS predefinidos.
Gerenciamento CSS esta caracterstica torna mais fcil para voc mover regras CSS de documento
para documento, desde o cabealho de um documento at uma folha externa e muito mais. Voc pode
tambm coloc-las onde voc precisar, apenas arrastando e soltando.
Adobe Device Central integrado com o Dreamweaver, bem como toda a famlia de software
Creative Suite 3, o Adobe Device Central simplifica a criao de contedos mveis, dando-lhe a
possibilidade de acessar rapidamente especificaes tcnicas essenciais de cada dispositivo, bem
como diminuir o texto e as imagens da sua pgina HTML.
Novidades da verso anterior:
Novidades da verso anterior:
www.komedi.com.br
17
www.komedi.com.br
17
Ferramenta Zoom adquira maior controle sobre seu projeto com esta ferramenta que amplia e
reduz de forma fcili a rea de visualizao, de acordo com o tipo de trabalho a ser realizado,
minucioso ou que exija uma viso global;
Guides as guias permitem a comparao do layout criado com o modelo de pgina desejado com
maior preciso. A realimentao visual torna a medio mais precisa, alm de suportar o modo
inteligente de colar imagens guia;
Visual XML data binding permite o desenvolvimento mais rpido em XML. uma ferramenta
visual poderosa, que elimina os mistrios da converso entre XML e HTML;
Novo CSS Styles panel este novo painel unificado proporciona um ambiente centralizado para
aprender, compreender e trabalhar com estilos CSS, os quais so aplicados s pginas de forma
visual. Toda a funcionalidade CSS consolidada em um nico painel, criado e otimizado para tornar
o trabalho mais fcil e produtivo;
Visualizo de Layout CSS torna muito mais fcil a formatao de pginas em CSS. Recursos
visuais facilitam o esboo de cores e bordas de layout CSS. Dreamweaver pode reproduzir os mais
complicados layouts e designs baseados em CSS de forma mais precisa, com manipulaes visuais
robustas. Ao clicar no layout CSS, valiosas dicas so exibidas, para ajud-lo a entender os elementos
que controlam o design;
Code collapse com a expanso e reduo de blocos de cdigo, voc pode focar apenas no cdigo
que deseja visualizar, agilizando o trabalho de programao.
Coding toolbar esta nova ferramenta fornece botes, para utilizao dos recursos de cdigo
mais comuns, em uma barra auxiliar alocada na lateral do Code View.
Background file transfer enquanto o programa faz o upload de arquivos para o servidor de
hospedagem, voc pode continuar trabalhando normalemente, sem interferncias.
Comando Insert Flash Video permite a insero simples e fcil de um filme flash em uma
pgina web.
Ferramenta Zoom adquira maior controle sobre seu projeto com esta ferramenta que amplia e
reduz de forma fcili a rea de visualizao, de acordo com o tipo de trabalho a ser realizado,
minucioso ou que exija uma viso global;
Guides as guias permitem a comparao do layout criado com o modelo de pgina desejado com
maior preciso. A realimentao visual torna a medio mais precisa, alm de suportar o modo
inteligente de colar imagens guia;
Visual XML data binding permite o desenvolvimento mais rpido em XML. uma ferramenta
visual poderosa, que elimina os mistrios da converso entre XML e HTML;
Novo CSS Styles panel este novo painel unificado proporciona um ambiente centralizado para
aprender, compreender e trabalhar com estilos CSS, os quais so aplicados s pginas de forma
visual. Toda a funcionalidade CSS consolidada em um nico painel, criado e otimizado para tornar
o trabalho mais fcil e produtivo;
Visualizo de Layout CSS torna muito mais fcil a formatao de pginas em CSS. Recursos
visuais facilitam o esboo de cores e bordas de layout CSS. Dreamweaver pode reproduzir os mais
complicados layouts e designs baseados em CSS de forma mais precisa, com manipulaes visuais
robustas. Ao clicar no layout CSS, valiosas dicas so exibidas, para ajud-lo a entender os elementos
que controlam o design;
Code collapse com a expanso e reduo de blocos de cdigo, voc pode focar apenas no cdigo
que deseja visualizar, agilizando o trabalho de programao.
Coding toolbar esta nova ferramenta fornece botes, para utilizao dos recursos de cdigo
mais comuns, em uma barra auxiliar alocada na lateral do Code View.
Background file transfer enquanto o programa faz o upload de arquivos para o servidor de
hospedagem, voc pode continuar trabalhando normalemente, sem interferncias.
Comando Insert Flash Video permite a insero simples e fcil de um filme flash em uma
pgina web.
1.5.1. Outros recursos importantes
1.5.1. Outros recursos importantes
Cpia e Colagem do Microsoft Word e do Microsoft Excel permite copiar diretamente de um

document Word ou Excel, diretamente no Dreamweaver, preservando formatao e gerando um
cdigo HTML de qualidade.
Realimentao visual da edio de tabelas permite verificar os efeitos que o redimensionamento
de colunas produzir nas tabelas, alm de tornar mais fcil a seleo de elementos de tabelas.
Interface de usurio maximiza o espao til da rea de Trabalho, mostrando mais claramente o
contexto e o foco, tornando a interface mais amigvel e lgica.
Start Page permite acessar arquivos usados mais recentemente, criar novos arquivos e ter acesso
aos recursos do Dreamweaver.
Opo de salvar desktop Permite reabrir o ltimo documento alterado quando o programa for
reinicializado.
Suporte completo Unicode Dreamweaver no Windows suporta todas as codificaes de texto
suportadas pelo Internet Explorer, permitindo utilizar quase todas as fontes de qualquer lnguas.
FTP seguro Permite encripitar todas as transferncias de arquivos e prevenir acesso no autorizado
a seus dados, arquivos, nomes e senhas.
Validao dinmica de cross-browser automaticamente verifica a compatibilidade do documento
atual com vrios browsers, quando este salvo, ou seja, deixa voc seguro de no estar utilizando
tags ou construes CSS que os browsers de destino especificados no suportam.
Cpia e Colagem do Microsoft Word e do Microsoft Excel permite copiar diretamente de um

document Word ou Excel, diretamente no Dreamweaver, preservando formatao e gerando um
cdigo HTML de qualidade.
Realimentao visual da edio de tabelas permite verificar os efeitos que o redimensionamento
de colunas produzir nas tabelas, alm de tornar mais fcil a seleo de elementos de tabelas.
Interface de usurio maximiza o espao til da rea de Trabalho, mostrando mais claramente o
contexto e o foco, tornando a interface mais amigvel e lgica.
Start Page permite acessar arquivos usados mais recentemente, criar novos arquivos e ter acesso
aos recursos do Dreamweaver.
Opo de salvar desktop Permite reabrir o ltimo documento alterado quando o programa for
reinicializado.
Suporte completo Unicode Dreamweaver no Windows suporta todas as codificaes de texto
suportadas pelo Internet Explorer, permitindo utilizar quase todas as fontes de qualquer lnguas.
FTP seguro Permite encripitar todas as transferncias de arquivos e prevenir acesso no autorizado
a seus dados, arquivos, nomes e senhas.
Validao dinmica de cross-browser automaticamente verifica a compatibilidade do documento
atual com vrios browsers, quando este salvo, ou seja, deixa voc seguro de no estar utilizando
tags ou construes CSS que os browsers de destino especificados no suportam.
18
18
www.komedi.com.br
www.komedi.com.br
Aba CSS mostra as regras de CSS aplicadas na seleo atual, tanto no modo visual quanto no
modo de cdigo.
Inspetor de propriedades de texto baseado em CSS lista todos os estilos disponveis no texto e
possui uma pr-visualizao do aspecto do texto aps a aplicao do estilo.
Propriedades de pgina baseado em CSS oferece mais controle sobre as propriedades de pgina,
como aparncia de cabealhos e links, usando construes codificado em CSS.
Barra integrada de edio de imagens permite que voc faa edies de imagens bsicas de
dentro do Dreamweaver, utilizando tecnologia Adobe Fireworks.
Inspetor de Tag aperfeioado mostra uma lista das propriedades disponveis para a seleo atual,
permitindo edio rpida e abrangente.
Edio de arquivo sem site permite trabalhar diretamente em um servidor FTP ou RDS, sem criar
um Site Dreamweaver.
Comportamentos de servidor PHP permite criao de conjuntos de pginas mestre/detalhe e de
pginas de autenticao de usurio.
Controle de formulrios para ASP.NET aperfeioado oferece novas e melhoras formas de
construir e manipular formulrios de Web ASP.NET no modo visual.
Aba CSS mostra as regras de CSS aplicadas na seleo atual, tanto no modo visual quanto no
modo de cdigo.
Inspetor de propriedades de texto baseado em CSS lista todos os estilos disponveis no texto e
possui uma pr-visualizao do aspecto do texto aps a aplicao do estilo.
Propriedades de pgina baseado em CSS oferece mais controle sobre as propriedades de pgina,
como aparncia de cabealhos e links, usando construes codificado em CSS.
Barra integrada de edio de imagens permite que voc faa edies de imagens bsicas de
dentro do Dreamweaver, utilizando tecnologia Adobe Fireworks.
Inspetor de Tag aperfeioado mostra uma lista das propriedades disponveis para a seleo atual,
permitindo edio rpida e abrangente.
Edio de arquivo sem site permite trabalhar diretamente em um servidor FTP ou RDS, sem criar
um Site Dreamweaver.
Comportamentos de servidor PHP permite criao de conjuntos de pginas mestre/detalhe e de
pginas de autenticao de usurio.
Controle de formulrios para ASP.NET aperfeioado oferece novas e melhoras formas de
construir e manipular formulrios de Web ASP.NET no modo visual.
1.6.
1.6.
Fechamento de Arquivos
Para fechar apenas o arquivo de trabalho, sem fechar o programa, proceda da seguinte forma:
Fechamento de Arquivos
Para fechar apenas o arquivo de trabalho, sem fechar o programa, proceda da seguinte forma:
Para fechar um arquivo:
Para fechar um arquivo:
1. No menu File, clique no comando Close.

ou,
1. Pressione, simultaneamente, as teclas CTRL + W.
1. No menu File, clique no comando Close.

ou,
1. Pressione, simultaneamente, as teclas CTRL + W.
www.komedi.com.br
19
www.komedi.com.br
19
1.7.
1.7.
A Finalizao do Dreamweaver
Para encerrar o Dreamweaver:
Para encerrar o Dreamweaver:
1. No menu File, clique no comando Exit.

ou,
1. No menu File, clique no comando Exit.

ou,
1.
D um clique no boto Close (

de ttulo.
), localizado no canto superior direito da barra
1.
ou,
1. Pressione, simultaneamente, as teclas CTRL + Q.
ou,
1. Pressione, simultaneamente, as teclas ALT + F4.
1.8.
20
A Finalizao do Dreamweaver
D um clique no boto Close (

de ttulo.
), localizado no canto superior direito da barra
ou,
1. Pressione, simultaneamente, as teclas CTRL + Q.
ou,
1. Pressione, simultaneamente, as teclas ALT + F4.
Exerccios
1.8.
Exerccios
1.
Quais as categorias da Barra Insert? Qual a funo geral desta barra?
1.
Quais as categorias da Barra Insert? Qual a funo geral desta barra?
2.
Quais os elementos que compem a Barra de Ferramentas Document? Qual a

funo geral desta barra?
2.
Quais os elementos que compem a Barra de Ferramentas Document? Qual a

3.
Quais os elementos que compem a Barra de Ferramentas Standard? Qual a

3.
Quais os elementos que compem a Barra de Ferramentas Standard? Qual a

4.
Qual a funo principal do menu File? Cite alguns de seus comandos bsicos.
4.
Qual a funo principal do menu File? Cite alguns de seus comandos bsicos.
www.komedi.com.br
20
www.komedi.com.br
5.
Qual a funo principal do menu Text? Cite alguns de seus comandos bsicos.
5.
Qual a funo principal do menu Text? Cite alguns de seus comandos bsicos.
6.
Cite algumas das novas facilidades do programa que acredita serem mais
interessantes e facilitadoras do trabalho de criao de pginas e sites.
6.
Cite algumas das novas facilidades do programa que acredita serem mais
interessantes e facilitadoras do trabalho de criao de pginas e sites.
www.komedi.com.br
21
www.komedi.com.br
21

Dreamweaver CS3 Komedi

Enviado por

Dados do documento

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Dreamweaver CS3 Komedi

Enviado por

Direitos autorais:

Formatos disponíveis

Fone: (19) 3234-4864

Fone: (19) 3234-4864

Copyright by Editora Komedi, 2009

Copyright by Editora Komedi, 2009

Dados para Catalogao

Dados para Catalogao

Rimoli, Monica Alvarez

Rimoli, Monica Alvarez

Campinas: Editora Komedi, 2009.

Campinas: Editora Komedi, 2009.

Adobe Dreamweaver CS3 marca registrada da Adobe Systems Incorporated

Adobe Dreamweaver CS3 marca registrada da Adobe Systems Incorporated

Nenhuma parte desta publicao poder ser reproduzida, armazenada ou

Nenhuma parte desta publicao poder ser reproduzida, armazenada ou

Todos os direitos reservados na forma da lei pela:

Todos os direitos reservados na forma da lei pela:

O AMBIENTE ADOBE DREAMWEAVER CS3 .....................................................9

INSTALAO DO DREAMWEAVER ..............................................................................9

SITES DREAMWEAVER .........................................................................................23

INSTALAO DO DREAMWEAVER ..............................................................................9

A CRIAO DE UM NOVO SITE .................................................................................23

GERENCIAMENTO DO SITE DREAMWEAVER...............................................41

PROPRIEDADES DOS DOCUMENTOS ................................................................55

SITES DREAMWEAVER .........................................................................................23

A CRIAO DE UM NOVO SITE .................................................................................23

3.1. ACESSO A SITES, SERVIDORES E DRIVES LOCAIS.......................................................41

O AMBIENTE ADOBE DREAMWEAVER CS3 .....................................................9

GERENCIAMENTO DO SITE DREAMWEAVER...............................................41

PROPRIEDADES DOS DOCUMENTOS ................................................................55

Adobe Dreamweaver CS3

Adobe Dreamweaver CS3

4.3.1. Trabalho com Cores .................................................................................... 56

ADIO DE CONTEDO PGINA .................................................................. 63

4.3.1. Trabalho com Cores .................................................................................... 56

5.1. INSERO DE TEXTO................................................................................................ 63

5.1. INSERO DE TEXTO................................................................................................ 63

6.1. LOCALIZAO E CAMINHOS DOS

FORMATAO DE TEXTO ................................................................................... 97

7.1. AS LISTAS ................................................................................................................ 97

ADIO DE CONTEDO PGINA .................................................................. 63

FORMATAO DE TEXTO ................................................................................... 97

AUTOMATIZAO DE TAREFAS .....................................................................115

8.1. USO DO PAINEL HISTORY .......................................................................................115

O LAYOUT DE PGINA ........................................................................................121

AUTOMATIZAO DE TAREFAS .....................................................................115

O LAYOUT DE PGINA ........................................................................................121

9.1. LAYOUT DE PGINAS COM CSS .............................................................................121

9.1. LAYOUT DE PGINAS COM CSS .............................................................................121

10. TABELAS ..................................................................................................................135

10. TABELAS ..................................................................................................................135

10.1.1. Precedncia de Formatao em HTML .....................................................135

10.1.1. Precedncia de Formatao em HTML .....................................................135

Adobe Dreamweaver CS3

Adobe Dreamweaver CS3

10.6. ADIO E REMOO DE LINHAS E COLUNAS ......................................................... 149

10.6. ADIO E REMOO DE LINHAS E COLUNAS ......................................................... 149

11. FRAMES (MOLDURAS OU QUADROS) ............................................................ 157

11. FRAMES (MOLDURAS OU QUADROS) ............................................................ 157

11.1. FRAMES E FRAMESETS .......................................................................................... 157

11.1. FRAMES E FRAMESETS .......................................................................................... 157

12. OS FORMULRIOS ............................................................................................... 169

12. OS FORMULRIOS ............................................................................................... 169

12.1. OS SCRIPTS CGI .................................................................................................... 169

12.1. OS SCRIPTS CGI .................................................................................................... 169