LINGUAGEM PRÁTICA DE PROGRAMAÇÃO Dependência Apostila HTML - Básico SUMÁRIO
|
|
|
- Pietra Valgueiro Freire
- 7 Há anos
- Visualizações:
Transcrição
1 SUMÁRIO I. HTML (INTRODUÇÃO) II. CRIANDO UMA PASTA WEB III. CRIANDO SUA PRIMEIRA PÁGINA IV. EXEMPLO COMPLETO V. VISUALIZANDO SUA PÁGINA VI. ABRINDO O CÓDIGO FONTE VII. FORMATAR O TEXTO VIII. CABEÇALHOS IX. EXEMPLOS DE CORES X. PARÁGRAFOS XI. LISTAS ORDENADAS XII. IMAGENS XIII. HYPERLINK XIV. XV. DOWNLOAD XVI. LINK XVII. TABELAS XVIII. FORMULÁRIOS XIX. ACTION XX. METHOD XXI. CAMPO INPUT XXII. CAMPO HIDDEN XXIII. CAMPO PASSWORD XXIV. BOTÕES RÁDIO XXV. BOTÕES RESET XXVI. BOTÕES SUBMIT XXVII. NAME XXVIII. VALUE XXIX. SELECT XXX. OPTION XXXI. FORMULÁRIOS PARA ENVIO DE MENSAGENS XXXII. FORMULÁRIO JAVASCRIPT PARA ENVIO DE MENSAGENS XXXIII. FRAMES XXXIV. JAVASCRIPT XXXV. ASP XXXVI. EXEMPLO ASP XXXVII. EVITANDO ERROS XXXVIII. ENVIANDO SUAS PÁGINAS PARA O SERVIDOR XXXIX. TORNANDO SUA PÁGINA CONHECIDA XL. COMO ATRAIR VISITANTES ATÉ SUA PÁGINA XLI. META XLII. CONSIDERAÇÕES FINAIS XLIII. ENDEREÇOS XLIV. TERMO DE USO 1
2 HTML INTRODUÇÃO A Linguagem HTML (Hypertext Markup Language Linguagem de marcação de hipertexto) é usada para criar as páginas divulgadas na World Wide Web, o serviço, mas popular na Internet. Com a linguagem HTML são criados os hyperlinks que permitem navegar pela Web. Para isso utiliza marcações, chamadas tags, no ponto da página em que é feito um hyperlink com outra página. Para criar uma página HTML, usaremos o Bloco de notas, um editor de texto simples que acompanha o Windows e um navegador (Browser) Netscape Communicator e Microsoft Internet Explorer. Isto é tudo que você precisa. Existem algumas diferenças na exibição das páginas entre os navegadores. Neste caso é bom testar suas páginas em ambos navegadores. Criando uma pasta Web Antes de começar a criar suas páginas crie uma pasta para armazenar todas páginas, figuras e arquivos que usará. Abra o Windows Explorer (Iniciar/ Programas/ Windows Explorer). Com o Windows Explorer aberto clique em Arquivo/ Novo/ Pasta. 2
3 Dê um nome sugestivo a esta pasta e coloque nesta pasta todas imagens gif e jpg que gostaria que sua página tivesse. Criando sua primeira página HTML 1º Abra o Bloco de notas. Clique em Editar e marque o item Mudança Automática de linha. 2º Digite a seguinte tag: <HTML> Toda página HTML deve iniciar com essa tag. 3º Digite: <HEAD> O cabeçalho de sua página deve ser delimitado pelas tags <HEAD> e </HEAD> 4º Digite: <TITLE> Onde deve ficar o título da página Feche com a tag</title> <TITLE>Minha primeira página HTML</TITLE> 5º Feche agora o cabeçalho de sua página digitando </HEAD> 6º Digite: <BODY> 3
4 Para abrir o corpo da página. Você pode deixar uma cor para o corpo da página. Digitando Ex.: <BODY BGCOLOR= CCFFFF > Você pode inserir um título em sua página <H1>Essa é minha primeira página HTML</H1> O tamanho vai de <H1> tamanho maior até <H6> tamanho menor. 7º Para inserir texto digite: <P> texto aqui... <P>Páginas HTML podem ser criadas em qualquer editor de texto </P> 8º Vamos fechar o corpo da página digitando: </BODY> 9º Fechando a página digitando a tag </HTML> Exemplo completo <HTML> <HEAD> <TITLE>Minha primeira página HTML</TITLE> </HEAD> <BODY> <H1>Essa é minha primeira página HTML</H1> <P>Páginas HTML podem ser criadas em qualquer editor de texto.</p> </BODY> </HTML> 10º Salve sua página HTML clicando em Arquivo/Salvar. Dê um nome para a página que acabou de criar escolha à pasta (Salvar em:) Salve com extensão.htm ou.html. 4
5 nome.htm ou nome.html Para evitar que seu editor de texto coloque.txt como extensão do documento digite aspas envolvendo o nome do arquivo "nome.html". Visualizando sua página Abra seu navegador padrão Internet Explorer (IE) ou Netscape Communicator. Clique em Arquivo/ Abrir/ Procurar Em Examinar escolha a pasta que criou para armazenar suas página clique na página que criou e clique em Abrir. 5
6 No Netscape clique em File/ Open Page/ Choose File. Em Examinar escolha a pasta e a página e clique em Abrir. A página sendo visualizada pelo navegador Microsoft Internet Explorer 6
7 Exemplo da explicação entre os passos 1º ao 10º na pasta Exemplos. Exemplos/Texto.htm Abrindo o código fonte Você pode abrir o código fonte de uma página e visualizar as tags de sua página. Para isso a página precisa estar carregada em seu navegador (browser). No Internet Explorer clique em Exibir/Código fonte. O código fonte será aberto no Bloco de notas. 7
8 Se o arquivo html for muito grande, será solicitado que você utilize o WordPad para abrir o arquivo. Formatar o Texto Uma página HTML é reconhecida pelas seguintes tags <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> </BODY> </HTML> Texto, imagem, formulários devem ficar entre as tags <BODY> e </BODY> Cabeçalhos A tag <H1> permite especificar até seis níveis de cabeçalhos. Ex. <H1>texto aqui</h1> <H2>texto aqui</h2> <H3>texto aqui</h3> <H4>texto aqui</h4> <H5>texto aqui</h5> <H6>texto aqui</h6> <P> Inseri texto comum, com espaço de uma linha para o texto a seguir. Ex: <P ALIGN= CENTER >texto aqui</p> Texto alinhado ao centro. Formatos para alinhar o texto: RIGHT, CENTER e LEFT. 8
9 <FONT>Permite inserir o nome da fonte, tamanho e cor. Ex.: <FONT FACE= ARIAL COLOR= BLUE SIZE=2> FACE nome da fonte. Outros nomes COURIER NEW, VERDANA, IMPACT, etc. COLOR cor da fonte Exemplos de cores BLACK BLUE BEIGE GOLD GRAY GREEN NAVY ORANGE PINK RED TEAL YELLOW WRITE SILVER CYAN Preto Azul Bege Ouro Cinza Verde Azul marinho Laranja Rosa Vermelho Verde azulado Amarelo Branco Prata Azul claro SIZE tamanho, que vai de tamanho menor 1 até tamanho maior 7. <B> Texto em negrito Ex.: <B>texto aqui</b> <I> Texto em Itálico Ex.: <I>texto aqui</i> <U> Texto sublinhado Ex.: <U>texto aqui</u> <SUP> Texto sobrescrito Ex.: <SUP> texto aqui </SUP> <SUB> Texto subscrito Ex.: <SUB> texto aqui </SUB> <TT>Texto mono-espaço Ex.: <TT>texto aqui</tt> Parágrafos 9
10 Utilizando determinadas tags você pode recuar texto, marcar itens, numerar itens, justificar, centralizar parágrafos, etc. <BLOCKQUOTE> Deixa o parágrafo um pouco recuado Ex.: <BLOCKQUOTE>texto aqui</blockquote> <PRE>Deixa o texto igual ao que você escreveu. Ex.:<PRE> te x t o a qu i</pre> Listas <OL>Lista ordenada Ex.: <OL> <LI>JavaScript <LI>VBScript <LI>ActiveX </<OL> Resultado 1. JavaScript 2. VBScript 3. ActiveX <UL>Lista não ordenada Ex.: <UL> <LI>ICQ <LI>AutoCad <LI>SQL </UL> Resultado ICQ AutoCad SQL UL pode assumir os seguintes formatos: <UL TYPE=CIRCLE> <UL TYPE=SQUARE> <UL TYPE=DISC> <BR> pula uma linha <HR> desenha uma linha <!-- comentário --> linha de comentário. 10
11 <CENTER> Centraliza determinado texto Ex.:<CENTER>Apostilas para download</center> Pode ser usa para alinhar texto, imagens, tabelas, etc. Imagens GIF é a melhor opção de formato de imagens para seu utilizado em páginas Web. O formato GIF é compacto e permite criar pequenas animações animado GIF. Não ilustre suas páginas Web com imagens no formato (Bitmap). O formato Bitmap cria imagens com excelente qualidade mais devido ao tamanho muito demoradas para carregar em uma página Web. Você pode criar suas imagens GIF utilizando programas como o MS-Paint (Windows 98) ou MS-Photo Editor (Office 9x/2000) que permite transparência. Para inserir uma imagem no corpo da página digite <IMG SRC= imagem.gif > IMG tag para imagem. SRC o caminho (pasta) ou mesmo se a imagem estiver na mesma pasta somente o nome da imagem e sua extensão que pode ser GIF ou JPG. Ao trabalhar com imagem e texto juntos você deve definir como a imagem será apresentada em relação ao texto. 11
12 <FONT FACE="ARIAL" SIZE=2> Muitos querem saber quem é o dono da Internet ou quem administra os milhares de computadores e linhas que a fazem funcionar.<img SRC="Imagens/micro.gif" ALT="Imagem de um Computador" ALIGN="right"> Vamos voltar um pouco no tempo. Nos anos 60, quando a Guerra Fria pairava no ar, grandes computadores espalhados pelos Estados Unidos armazenavam informações militares estratégicas... </FONT> ALT um texto será exibido quando se passa o mouse sobre a imagem. Também pode ser usado para indicar do que se trata a imagem quando a página está carregando. ALIGN= alinhamento. Alimento da imagem à direita do texto Outros alinhamentos possíveis CENTER, LEFT. Você pode especificar altura e largura da imagem caso ocorra uma necessidade de diminuir o tamanho da imagem. Ex.: <IMG SRC="Imagens/micro.gif" ALT="Imagem de um Computador" ALIGN="right" WIDTH= 100 HEIGHT= 100 > 12
13 Note que SRC é o local (pasta Imagens/) onde se encontra a imagem micro.gif. Você pode apontar para uma figura de uma página Web. Ex.: <IMG SRC= > Isso reduz a quantidade de imagens em sua pasta no servidor. Não abuse da quantidade de imagens em uma única página, o visitante acaba desistindo de carregar uma página que está demorando aparecer. Coloque no máximo 30 KB de imagem por página. Com a maioria dos modem de KBps sua página aparece em segundos. Exemplo de como inserir imagens <HTML> <HEAD> <TITLE>Trabalhando com Imagens</TITLE> </HEAD> <BODY> <H1>A Internet</H1> <FONT FACE="ARIAL" SIZE=2> Muitos querem saber quem é o dono da Internet ou quem administra os milhares de computadores e linhas que a fazem funcionar.<img SRC="Imagens/micro.gif" ALT="Imagem de um Computador" ALIGN="right"> Vamos voltar um pouco no tempo. Nos anos 60, quando a Guerra Fria pairava no ar, grandes computadores. Espalhados pelos Estados Unidos armazenavam informações militares estratégicas... </FONT> </BODY> </HTML> Hyperlink Para inserir um hyperlink que aponte para outra página digitamos <A HREF= outropagina.html >Outro Página</A> A de âncora HREF local referente Outro Página texto visível às vezes sublinhado. Passando o mouse sobre o texto o ponteiro de mouse se torna uma mãozinha apontando para clicar. </A> fecha o hyperlink O exemplo de hyperlink para uma página da mesma pasta. Ex.: <A HREF= apostilas.html >Apostilas</A> Um exemplo de hyperlink para uma página Web. Ex.: <A HREF= >Apostilas</A> 13
14 Você pode abrir uma nova janela do navegador usando um hyperlink Ex.: <A HREF= apostilas.html TARGET= _NEW >Apostilas</A> TARGET= _NEW abre o endereço em uma nova janela TARGET= _TOP abre o endereço na mesma janela _NEW abre o endereço em uma nova janela do navegador. Você pode incluir uma imagem como hyperlink. Ex.:<A HREF= apostilas.html ><IMG SRC= apostilas.gif BORDER=0></A> A HREF âncora e local IMG SRC imagem e local BORDER=0 borda com valor zero (sem borda). E- mail Para alguém envie um para sua conta de basta digitar a seguinte tag <A HREF= MAILTO:seu @provedor.com.br >Dúvidas, Críticas e sugestões envie um </a> A HREF âncora e local MAILTO e- mail para sua conta de e- mail. provedor.com.br local onde você mantém seus e- mails Dúvidas, Críticas e sugestões... texto que será exibido como hyperlink. Você pode incluir um assunto Subject para o . Ex.: <A HREF= MAILTO:seu @provedor.com.br?SUBJECT=JavaScript >JavaScript</A> Download É fácil fazer com que um visitante baixe um arquivo em sua página. GIF, ASP, JPG, HTML, SWF, TXT são formatos de arquivos que são exibidos no próprio navegador. EXE, ZIP, ARJ, entre outros são arquivos que podem ser baixados para o computador do visitante. Provavelmente você clicou em html.zip para baixar esta apostilas Basta escrever <A HREF= html.zip >HTML</A> A HREF âncora e local html.zip arquivo e extensão HTML texto que será exibido como hyperlink para baixar arquivo. Link Vamos supor que você esteja criando uma página com um índice e quer que os visitantes achem rapidamente o assunto relacionado a um tópico que procura em apenas um clique. Então crie Links que achem determinado texto na página 14
15 Ex.: <A HREF="#link">Apostila JavaScript</A> <BR> <A HREF="#link2">Apostila VBSCript</A> <BR> Para testar insira neste espaço algumas tags <BR> (quebra de linha) e <HR> um traço que cobre uma linha <A NAME="link">Apostila JavaScript</A> <BR> <A NAME="link2">Apostila VBScript</A> Ao clicar em <A HREF= #link >Apostilas JavaScript</a> O visitante será levado até o texto sobre JavaScript que você insere após a linha <A NAME= link >Apostila JavaScript</A> Tabelas Com uma tabela você pode fazer algo simples como uma tabela de preço de produtos, dividir o texto lado- a- lado com as figuras, criar uma página utilizando tabelas para compor o visual do site. O limite é sua imaginação. Para inicial uma tabela digite o seguinte 15
16 <TABLE BORDER CELLSPACING=2 CELLPADDING=2 COLS=3 WIDTH="100%" BGCOLOR="#FFFF99" > TABLE de tabela em inglês BORDER de borda se você colocar BORDER=0 sua tabela não terá bordas. CELLSPACING espaço entre as células CELLPADDING espaço entre o texto e as bordas da célula mesmo que BORDER=0 COLLS quantidade de colunas neste caso 3 para Apostila, Descrição e Preço WIDTH largura BGCOLOR cor de fundo <TR> TR (Table Row) são as linhas <TD>Apostila</TD> TD (Table Data) são as colunas <TD>Descrição</TD> <TD>Preço</TD> </TR> <TR> <TD>JavaScript 1.2</TD> <TD>Linguagem para Web</TD> <TD>R$ 30,00 reais</td> </TR> <TR> <TD>VBScript</TD> <TD>Linguagem para Web</TD> <TD>R$ 30,00 reais</td> </TR> <TR> <TD>Word 2000</TD> <TD>Processdor Word ver. 2000</TD> <TD>R$ 45,00 reais</td> </TR> <TR> <TD>Linux</TD> <TD>Aprenda sobre Linux</TD> <TD>R$ 25,00 reais</td> </TR> </TABLE> Exemplo completo <TABLE BORDER CELLSPACING=2 CELLPADDING=2 COLS=3 WIDTH="100%" BGCOLOR="#FFFF99" > <TR> <TD>Apostila</TD> <TD>Descrição</TD> <TD>Preço</TD> </TR> 16
17 <TR> <TD>JavaScript 1.2</TD> <TD>Linguagem para Web</TD> <TD>R$ 30,00 reais</td> </TR> <TR> <TD>VBSCript</TD> <TD>Linguagem para Web</TD> <TD>R$ 30,00 reais</td> </TR> <TR> <TD>Word 2000</TD> <TD>Processdor Word ver. 2000</TD> <TD>R$ 45,00 reais</td> </TR> <TR> <TD>Linux</TD> <TD>Aprenda sobre Linux</TD> <TD>R$ 25,00 reais</td> </TR> </TABLE> Resultado da tabela 17
18 Você pode especificar ainda cor de células e cor de todo funda da tabela Ex.: <TABLE BORDER CELLSPACING=2 CELLPADDING=2 COLS=3 WIDTH="100%" BGCOLOR="#336699" > <TR BGCOLOR= #CCFFFF > <TD BGCOLOR= NAVY > Uma tabela não serve somente para inserir texto, você pode inserir hyperlink, figuras, botões que veremos a seguir em Formulário. Formulário Qualquer um que mantém uma Home Page na Internet gostaria de saber se o que o visitante achou da página. Isso pode ser feito por , mas um formulário pode ir além. Um formulário pode servir de pesquisa com botões de rádio, caixas de texto com valor pré-formatado. ACTION O atributo Action é especifica o local de envio do conteúdo do formulário <FORM METHOD=get ACTION="minhapagina.htm"> METHOD O atributo Method especifica as variações do protocolo utilizado para o envio do conteúdo do formulário. Get (padrão) ou Post. <FORM METHOD=get ACTION="minhapagina.htm"> CAMPO INPUT O campo Input é utilizado para entrada de dados em formulário de preenchimento da HTML. Type determina o tipo do campo. <INPUT TYPE= TEXT > CAMPO HIDDEN O campo Hidden (oculto) não é apresentado ao usuário, mas seu conteúdo será enviado junto com o formulário. <INPUT TYPE= HIDDEN VALUE= seu @provedor.com.br > CAMPO PASSWORD O campo Password (senha) substitui os caracteres digitados por asteriscos. <INPUT TYPE= PASSWORD VALUE= Senha > BOTÕES RÁDIO 18
19 Os botões de rádio podem assumir um único valor dentre um conjunto de alternativas. Todos botões de um grupo devem ter nomes iguais. <INPUT TYPE="RADIO" VALUE="V1" CHECKED NAME="R1"> JAVASCRIPT <INPUT TYPE="RADIO" NAME="R1" VALUE="V2"> VBSCRIPT BOTÕES RESET Quando se clica em um botão Reset todos os campos do formulário retornam a seus valores iniciais. <INPUT TYPE="RESET" VALUE="Apagar"> BOTÕES SUBMIT Quando se clica em um botão Submit todos os dados preenchidos pelo usuário serão enviados. <INPUT TYPE="SUBMIT" VALUE="Enviar"> NAME O atributo Name fornece um string de caracteres utilizados para nomear o campo quando ocorrer o envio dos dados contidos no formulário. <INPUT TUPE=TEXT NAME="assunto"> VALUE Value é um string de caracteres ou número utilizado para iniciar campos Text ou Hidden. <INPUT TYPE="HIDDEN" NAME="SUBJECT" VALUE="Suporte"> SELECT O elemento Select é utilizado em menus de opção e múltipla. Representado na forma de menu pop-up ou drop-down. Amostras <SELECT NAME="destino"> <OPTION VALUE="access.zip">Access 97 <OPTION VALUE="flash.zip">Flash 4 <OPTION VALUE="frontp.zip">FrontPage2000 <OPTION VALUE="outlook2000.zip">Outlook 2000 <OPTION VALUE="vb.zip">Visual Basic 6 </SELECT> OPTION O elemento Option pode ocorrer apenas no âmbito de elementos Select, representando uma opção possível. <SELECT NAME="destino"> 19
20 <OPTION VALUE="asp.asp">ASP <OPTION VALUE="jscript.js">Javascript <OPTION VALUE="html.htm">Html </SELECT> FORMULÁRIOS PARA ENVIO DE MENSAGENS Se você quer coletar dados dos visitantes em sua página usando formulários. Os dados preenchidos serão enviados diretamente para sua conta de . O problema da maioria dos formulários está na hora de submeter os dados. Nem usando JavaScript as coisas saem como esperado, prepare- se para receber dados com este formato Oi+como+vai+tudo+bem?+Meu+nome+é. Se você não quer que isso aconteça deixa este trabalho para os formulários profissionais (FormMail e aspformmail) que você recebe junto com esta apostila. Se preferir você pode usar os GuestBooks( livro de visitantes). Digite GuestBooks no espaço reservado para palavra a ser pesquisada em um sistema de busca. FORMULÁRIO JAVASCRIPT PARA ENVIO DE MENSAGENS Você pode testar um sistema de envio de formulários para sua conta de correio usando JavaScript. Abra a pasta Exemplos/ JavaScript. Crie e modifique a primeira página onde o visitante preenche os dados. Pasta Exemplos/JavaScript/ .txt Crie e modifique a Segunda página onde é informado ao visitante que sua página foi enviada com sucesso. Pasta Exemplos/JavaScript/ 02.txt Frames Uns adoram outros detestam. Abrir uma página que tenha um índice de um lado e seu conteúdo do outro é maravilhoso. Porém se os quadros não forem bem planejados toda a estrutura da página pode ser comprometida. Uma página com frames na verdade abre duas ou mais páginas em uma só janela do navegador. Para criar uma página eficiente usando os frames faça dessa forma 1º criar duas ou três páginas que o frame usará 2º geralmente no quadro maior é onde as páginas abrem 3º para ter uma página usando 02 frames você precisa de três páginas. Veja o exemplo abaixo de Frame 1º Frame 20
21 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <A HREF="Efeitos.html" TARGET="gratis">Efeitos</A><BR> <A HREF="Tabela.html" TARGET="gratis">Tabela</A><BR> <A HREF="Texto.html" TARGET="gratis">Texto</A><BR> <A HREF="Imagens.html" TARGET="gratis">Imagens</A> </BODY> </HTML> 2º Frame <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <BR> <P ALIGN="CENTER">Aguardando</P> </BODY> </HTML> A página Frame já pronta <HTML> <HEAD> <TITLE>Trabalhando com Frames</TITLE> </HEAD> <FRAMESET COLS="20%,80%"> <FRAME SRC="Frame1.html" NAME="apostilas"> <FRAME SRC="Frame2.html" NAME="gratis"> </FRAMESET> </HTML> Entenda como foi criado o frame acima <HTML> <HEAD> <TITLE>Trabalhando com Frames</TITLE> </HEAD> <FRAMESET COLS="20%,80%"> Divide a página em duas colunas (COLS). Poderia ser em duas linhas (ROWS) Uma das colunas ocupará 20% e a outro 80%. 21
22 <FRAME SRC="Frame1.html" NAME="apostilas"> Á primeira página com 20%, abre a página Frame1.html, atributo (Name) apostilas. <FRAME SRC="Frame2.html" NAME="gratis"> O segundo quadro com 80% abre a página Frame2.html, atributo(name) gratis </FRAMESET> Fechando os quadros </HTML> Os Hyperlinks da primeira página abrem no segundo quadro de NAME= gratis <A HREF="Efeitos.html" TARGET="gratis">Efeitos</A><BR> <A HREF="Tabela.html" TARGET="gratis">Tabela</A><BR> <A HREF="Texto.html" TARGET="gratis">Texto</A><BR> <A HREF="Imagens.html" TARGET="gratis">Imagens</A> Dentro de uma tag <FRAME> você pode utilizar algumas formatações. <FRAME SRC= Fram1.html NAME= apostilas NORESIZE> NORESIZE não permite modificar o quadro SCROLLING barra de rolagem. YES (sim), NO (não), AUTO (automático) Ex.:SCROLLING= NO MARGINWIDTH cria uma margem horizontal Ex.: MARGINWIDTH= 50 MARGINHEIGTH cria uma margem vertical Ex.: MARGINHEIGTH= 50 JavaScript Desenvolvido pela Netscape Communications Corporation JavaScript foi a primeira linguagem de script para páginas Web. Popular, sofisticada, que pode ser escrita da mesma forma que as tags HTML, usando o Bloco de notas ou qualquer outro editor de texto. 22
23 Não confunda Java com JavaScript. Apesar de nomes parecidos e algumas semelhanças Java é uma linguagem para criar verdadeiros programas compilados (Ex. WordPerfect) enquanto JavaScript não contém compilador e é inserido diretamente em um documento HTML. Todo documento HTML deve conter as Tags <HTML> <HEAD> <TITLE>Minha página</title> </HEAD> <BODY> Você pode inserir os scripts entre as tags <HEAD></HEAD> e <BODY></BODY> Digite após a Tag <BODY> <SCRIPT LANGUAGEM= JavaScript > Todo script começa com a instrução <SCRIPT> O Browser reconhece este script como sendo JavaScript através da tag LANGUAGEM= JavaScript Digite: document.write(document.lastmodified); Veja a linha abaixo document.write Esta linha escreve no documento 23
24 document.lasmodified Última data em que o documento foi modificado Feche o script com a tag </SCRIPT> Exemplo complete <HTML> <HEAD><TITLE></TITLE></HEAD> <BODY> <H3>Mostra a última data que o documento foi modificado</h3> <SCRIPT LANGUAGE="JavaScript"> document.write(document.lastmodified); </SCRIPT> </BODY> </HTML> No script acima o Browser mostra a última data, horário em que o documento HTML foi modificado. Na internet você encontra alguns scripts úteis e outros nem tanto. Recebo vários s me pedindo um script que contenha um prompt e senha de acesso as páginas. Se você quer fechar determinada área de seu site a alguns visitantes e não sabe como fazer isso crie uma página de nome Senha.html. Esta página abrirá um prompt para digitar uma senha e pressionar Ok ou Cancel. 24
25 Se a senha estiver correta o usuário será levado até a página para clientes. Caso contrário o visitante será enviado até uma página default (área para visitantes). 25
26 Para criar a página Senha.html digite o seguinte script após a Tag <BODY> <SCRIPT LANGUAGEM= JavaScript > apostilas = window.prompt( Digite sua senha de acesso e clique em OK ); switch (apostilas) { case gratuito : window.location= Aceito.html ; break; default : window.location= Negado.html ; } </SCRIPT> Exemplo completado da página Senha.html <HTML> <HEAD><TITLE>Senha</TITLE></HEAD> <BODY> <SCRIPT LANGUAGEM= JavaScript > apostilas = window.prompt( Digite sua senha de acesso e clique em OK ); switch (apostilas) { case gratuito : window.location= Aceito.html ; break; default : window.location= Negado.html ; } </SCRIPT> </BODY> </HTML> O script acima contém uma variável apostilas Funções window.prompt e window.location Instruções switch e case Neste caso a senha é à palavra gratuito. Se palavra digitada no, prompt é gratuito o visitante será levado para página Aceito.html 26
27 Caso contrário o visitante será guiado até um página default Negado.html Todo visitante cadastrado terá a mesma senha? Resposta: Sim e não Você pode criar vários case e também vários window.location Pode mudar a senha de vez em quando. Seu script da página Senha.html não será visto, isso em parte. Mesmo que o usuário queira ver seu script olhando o script em Exibir/ Código fonte (Internet Explorer) você pode se defender modificando a página Senha.html Modifique a seguinte linha. <SCRIPT LANGUAGEM= JavaScript SRC= senha.js> </SCRIPT> Selecione todo o script apostilas = window.prompt( Digite sua senha de acesso e clique em OK ); switch (apostilas) { case gratuito : window.location= Aceito.html ; break; default : window.location= Negado.html ; } Recorte e cole em um novo documento. Salve esse documento com o nome de senha e extensão.js Veja como deve ficar o código da página Senha.html <HTML> <HEAD><TITLE>Senha</TITLE></HEAD> <BODY> <SCRIPT LANGUAGEM= JavaScript SRC= senha.js > </SCRIPT> </BODY> </HTML> O visitante precisa estar usando um Browser recente, versões atuais. 27
H T M L V E R S. 8 HTML
Índice a) HTML b) Criando sua primeira página c) Visualizando sua página d) Formatar o texto e) Exemplos de cores f) Parágrafos g) Imagens h) Hyperlink i) E-mail j) Download k) Link Legal l) Tabelas m)
APOSTILA H T M L SUMÁRIO
APOSTILA H T M L SUMÁRIO I. HTML (INTRODUÇÃO) II. CRIANDO UMA PASTA WEB III. CRIANDO SUA PRIMEIRA PÁGINA IV. EXEMPLO COMPLETO V. VISUALIZANDO SUA PÁGINA VI. ABRINDO O CÓDIGO FONTE VII. FORMATAR O TEXTO
Os slides que seguem mostram os principais comandos da linguagem HTML. Conhecer o código HTML possibilita a criação de páginas leves que contenham ape
INTRODUÇÃO A PROGRAMAÇÃO HTML Os slides que seguem mostram os principais comandos da linguagem HTML. Conhecer o código HTML possibilita a criação de páginas leves que contenham apenas os comandos necessários
HTML BÁSICO E TEMPLATE VIEW. Gabrielle Amorim Porto
HTML BÁSICO E TEMPLATE VIEW Gabrielle Amorim Porto HTML BÁSICO E TEMPLATE VIEW Hypertext Markup Language Linguagem de marcação de hipertexto; Descreve a estrutura das páginas Web utilizando tags. HTML
Tags estruturais <!-- --> Cria um comentário <html> </html> Envolve todo um documento html <head> </head> Envolve o cabeçalho de um documento html
Tags estruturais Cria um comentário Envolve todo um documento html Envolve o cabeçalho de um documento html Fornece informações gerais sobre o documento
O que faz um servidor/navegador web? 14/03/2016 Rômulo da Silva Lima Slid e 2
HTML O que faz um servidor/navegador web? e 2 O que é? HyperText Markup Language Utilizada para produzir páginas WEB Documentos escritos na linguagem HTML podem ser traduzidos por browser O HTML utiliza
COM222 DESENVOLVIMENTO DE SISTEMAS WEB. Aula 01: HTML e CSS
COM222 DESENVOLVIMENTO DE SISTEMAS WEB Aula 01: HTML e CSS 2 Conteúdo Noções introdutórias HTML CSS HTML: HyperText Markup Language 3 Linguagem usada para construir páginas Web Função principal Estruturar
Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza
Webdesign HTML Introdução a HTML e as principais tags da linguagem Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Apresentar a HTML
HTML. Professor Victor Sotero. html
HTML Professor Victor Sotero html 1 Conceito Linguagem com a finalidade de marcação de hipertexto, sendo assim escritas páginas da web, e interpretada pelo navegador. As páginas contém um código fonte,
Tabelas. Tabelas. Iniciando a construção... Atributos <table> Tag <table></table> 05/06/2011
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DA PARAÍBA CAMPUS CAMPINA GRANDE 1 2 Tabelas INTERNET BÁSICA: EXTENSIBLE HYPERTEXT MARKUP LANGUAGE XHTML PARTE 3 Largamente suportado(browser); Controlar
Tabelas. Tabelas. Iniciando a construção... Atributos <table> Tag <table></table> 05/04/2011
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DA PARAÍBA CAMPUS CAMPINA GRANDE 1 2 Tabelas INTERNET BÁSICA: EXTENSIBLE HYPERTEXT MARKUP LANGUAGE XHTML PARTE 3 Largamente suportado(browser); Controlar
Tabelas Div Span Frames Formulários
Tabelas Div Span Frames Formulários Tabelas Tabelas implementam um conceito importante de layout: as grades, segundo as quais organizamos textos e ilustrações de maneira harmoniosa. A utilização de tabelas
Ferramentas para Multimídia e Internet - 1486
1 Ferramentas para Multimídia e Internet - 1486 HTML BÁSICO: O que é uma página WEB? Uma página WEB, também conhecida pelo termo inglês webpage, é uma "página" na World Wide Web, geralmente em formato
HyperText Markup Language HTML. Formulário
HyperText Markup Language HTML Formulário Prof. Luis Nícolas de Amorim Trigo nicolas.trigo@ifsertao-pe.edu.br http://professor.ifsertao-pe.edu.br/nicolas.trigo/ Introdução O usuário interage com os serviços
Módulo 17E. Revisões de HTML. A) Noções básicas de HTML (cont.)
Módulo 17E Revisões de HTML A) Noções básicas de HTML (cont.) Inserção de Imagens A inserção de imagens em documentos HTML é feita através da tag (que não tem tag de fecho). A indicação do local
Mini-curso de PHP. Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva
Mini-curso de PHP Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva Aula 1 Breve introdução de HTML, Conceitos básicos de PHP, Sintaxe, Separador de instruções e Comentários (Cap 1
HTML (HyperText. Markup Language)
Pontifícia Universidade Católica do Rio Grande do Sul PUCRS Faculdade de Informática HTML (HyperText Markup Language) Prof. Fabiano Passuelo Hessel Profª. Leticia Lopes Leite Julho de 2002. 1. Introdução
17/01/2016 PROGRAMAÇÃO EM AMBIENTE WEB I UM POUCO DE HISTÓRIA WWW. Tudo começou com a ARPANET; 1977 ARPANET nasce
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades,
O que faz um servidor/navegador web? 30/03/2017 Rômulo da Silva Lima Slid e 2
HTML O que faz um servidor/navegador web? e 2 O que é? HyperText Markup Language Utilizada para produzir páginas WEB Documentos escritos na linguagem HTML podem ser traduzidos por browser O HTML utiliza
HTML? HTML? HTML? HTML e HTTP. HTML e HTTP 26/02/2011
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DA PARAÍBA CAMPUS CAMPINA GRANDE 1 2 HTML? INTERNET BÁSICA: EXTENSIBLE HYPERTEXT MARKUP LANGUAGE XHTML PARTE 1 Hypertext Markup Language (Linguagem de
Sumário. 1- Notícias. 1.1 Publicando uma nova notícia Blocos de edição
O site desenvolvido pela SH3 é intuitivo, totalmente gerenciado através de um painel de administração. Nele o usuário responsável será mantenedor de todas as informações e configurações existentes, podendo
Introdução à linguagem HTML. Volnys Borges Bernal
1 Introdução à linguagem HTML Volnys Borges Bernal 2013-2015 Volnys Bernal 2 Introdução à linguagem HTML Sumário Visão geral Primeira página Principais tags Principais atributos Formulários 2011-2015 Volnys
Este é o primeiro nível Este é o segundo nível Este é o terceiro nível Este é o quarto nível Este é o quinto nível Este é o sexto nível
1. Conhecendo as Tags HTML Agora que já vimos como é um arquivo HTML básico, podemos começar a ver as tags que irão construir as páginas. Elas ficam após o comando e neste local já se pode começar a escrever
PROGRAMAÇÃO EM AMBIENTE WEB I
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades,
CEEP-CENTRO ESTADUAL DE EDUCAÇÃO PROFISSIONAL PEDRO BOARETTO NETO INTERNET E PROGRAMAÇÃO WEB INICIO DE HTML
INICIO DE HTML Neste tutorial usaremos o já conhecido Notepad++ ou Bloco de Notas e um Browser (Chrome, Mozilla ou Internet Explorer). Para nossos exemplos usaremos o Chrome. A estrutura básica de uma
Formulários. Etapa 1 Criação de formulários
9 Formulários Objetivos deste capítulo Ao terminar este capítulo, você deverá: Saber o que são formulários; Conhecer as principais tags para construção de um formulário; Criar o layout simples de um formulário.
Informática I. Aula 3. Aula 3-03/09/2007 1
Informática I Aula 3 http://www.ic.uff.br/~bianca/informatica1/ Aula 3-03/09/2007 1 Ementa Noções Básicas de Computação (Hardware, Software e Internet) HTML e Páginas Web Internet e a Web Javascript e
Volnys Bernal. Introdução à linguagem HTML. Introdução à linguagem HTML. Visão geral. Visão geral. Visão geral. Visão geral.
1 2 Introdução à linguagem HTML Sumário Volnys Borges Bernal Primeira página Principais tags Principais atributos 3 4 HTML HTML = HyperText Markup Language Linguagem de marcação (Markup) para criação de
Módulo 17E. Revisões de HTML. A) Noções básicas de HTML
Módulo 17E Revisões de HTML A) Noções básicas de HTML Estrutura básica de um documento Um documento HTML começa com a tag de abertura e termina com a tag de fecho . De seguida, temos a considerar
Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza
Webdesign HTML Introdução a HTML e as principais tags da linguagem Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Apresentar a HTML
Desenvolvimento Web. HTML 5 Parte I. Prof. Vicente Paulo de Camargo
Parte I Prof. Vicente Paulo de Camargo Páginas com podem ser desenvolvidas com editor de texto simples Existem, no entanto, alguns editores interessantes, que facilitam a edição de páginas É o caso de
INTRODUÇÃO A PROGRAMAÇÃO PARA WEB
INTRODUÇÃO A PROGRAMAÇÃO PARA WEB PROF. ME. HÉLIO ESPERIDIÃO Navegador O navegador também conhecido como web browser é um programa que habilita seus usuários a interagirem com documentos hospedados em
Este arquivo é parte integrante do CD MEGA CURSOS Acesse - www.megacursos.com.br
Pg 1 Introdução... Pg 2 Exemplo completo... Pg 3 Passo 2... Pg 4 Hyperlinks e Texto dentro de uma caixa... Pg 5 Tag para cores e Tabelas... Pg 6 Formatar o Texto... Pg 7 Download... Pg 8 Frame... Pg 9
1. HTML - Introdução. Hyper Text Markup Language. É uma linguagem de formatação de conteúdos. Portável. Ficheiros de pequena dimensão
1. HTML - Introdução Hyper Text Markup Language É uma linguagem de formatação de conteúdos Não é uma linguagem de programação Portável Não depende da plataforma em que é vizualizado Ficheiros de pequena
MANUAL DE PUBLICAÇÃO NO PORTAL CAMPUS MATÃO
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DE SÃO PAULO CAMPUS MATÃO MANUAL DE PUBLICAÇÃO NO PORTAL CAMPUS MATÃO AUTOR: COORDENADORIA DE TECNOLOGIA DA INFORMAÇÃO CAMPUS MATÃO MATÃO 2016 SUMÁRIO
Prof. Fernando Gonçalves Abadia. Sistemas Multimídias
Prof. Fernando Gonçalves Abadia Sistemas Multimídias Títulos Títulos são definidos com as tags a . A define o título maior. A define o título menor. este é um título este
Adicionar uma figura, como um botão Submeter, a um formulário
PPaaggi innaa 1 Parte 2 Adicionar uma figura, como um botão Submeter, a um formulário Adicione uma figura a um formulário para usá-la no lugar de um botão Submeter. Após preencher o formulário, o visitante
Recursos Complementares (Tabelas e Formulários)
Linguagem de Programação para Web Recursos Complementares (Tabelas e Formulários) Prof. Mauro Lopes 1-31 30 Objetivo Nesta aula iremos trabalhar o conceito de tabelas e todas as tags associadas ao seu
HTML. HyperText Markup Language. v Rui Menino. Tags de marcação. Referência. (Linguagem de marcação de hypertext)
HTML HyperText Markup Language (Linguagem de marcação de hypertext) Tags de marcação Referência v1.1 2008-2017 Rui Menino tags Para formatar e paginar o texto dentro de uma página html, foi definido o
PROFESSORA MERRIS MOZER. Mestranda em Metodologias para o Ensino de Linguagens e suas Tecnologias
PROFESSORA MERRIS MOZER Mestranda em Metodologias para o Ensino de Linguagens e suas Tecnologias INTRODUÇÃO AO DESENVOLVIMENTO DE SISTEMAS WEB Aula 1 HTML INTRODUÇÃO O que é HTML? INTRODUÇÃO HTML ou Hypertext
HTML. HyperText Markup Language. Elaborado por Marco Soares
HTML HyperText Markup Language 1 HTML É uma linguagem de marcação utilizada para produzir páginas web As páginas web ou documentos html podem ser interpretados por navegadores web/browsers tais como Google
Passa a passo para construir uma página pessoal - Parte 1
Passa a passo para construir uma página pessoal - Parte 1 Quais ferramentas são necessárias? - Editor de texto básico (sem formatações): use o Bloco de Notas (não use o MS Word e WordPad) - Navegador (browser):
Obrigado por adquirir o GNOTE da IDEON Brazil, o mais moderno gerenciador de conteúdos da Internet.
Obrigado por adquirir o GNOTE da IDEON Brazil, o mais moderno gerenciador de conteúdos da Internet. Esse manual foi desenvolvido com o intuito de que você use de maneira eficaz os recursos que ele oferece
Formulários são áreas onde se inserem campos que permitem uma troca de informações maior entre usuários e desenvolvedores de sites HTML Até o momento,
HTML Formulários são áreas onde se inserem campos que permitem uma troca de informações maior entre usuários e desenvolvedores de sites HTML Até o momento, HTML mostrou-se uma linguagem bastante adequada
Formatação de Textos e Caracteres
Formatação de Textos e Caracteres Os comandos de formatação de caracteres são divididos em dois grupos: lógicos e físicos. Estilos físicos: ... - destaca o texto em negrito ... - exibe o
Construção de sites Aula 1
Construção de sites Aula 1 Programa Instrutor Universidade Federal do Paraná Pró-reitoria de Assuntos Estudantis Departamento de Informática 31 de Julho de 2010 Indice Estrutura da Internet 1 Estrutura
Adobe. Dreamweaver CS4
Adobe Dreamweaver CS4 ÍNDICE CAPÍTULO 1 INICIANDO O DREAMWEAVER... 7 CONHECENDO A TELA DO DREAMWEAVER... 8 CAPÍTULO 2 INICIANDO A CRIAÇÃO DO SITE... 15 REDIMENSIONANDO A JANELA DO DOCUMENTO... 18 INSERINDO
Universidade de São Paulo
Manual para usuários do site Este manual foi especialmente desenvolvido para os administradores de conteúdo de cada departamento, que terá uma pessoa responsável pelas atualizações das informações departamentais
Introdução a HTML. André Tavares da Silva.
Introdução a HTML André Tavares da Silva andre.silva@udesc.br HTML HiperText Markup Language Linguagem de marcação para criar páginas Web Formada por textos e comandos chamados tags (etiquetas/rótulos)
20/02/2014. <HTML> Introdução </HTML> Web
Introdução 1 Web 2 1 Web 3 Web 4 2 Web 5 Browsers 6 3 Editores 7 Editores 8 4 Aula Teórica-prática Etiquetas (tags) base Etiqueta principal e que deve abranger todo o código;
Como criar um menu pop-up no Dreamweaver
Como criar um menu pop-up no Dreamweaver Introdução: Seguindo o crescimento do conteúdo em sites de Internet, a necessidade por uma fácil navegação nas páginas cresce igualmente. Um menu pop-up pode ser
HTML. Leonardo Gresta Paulino Murta
HTML Leonardo Gresta Paulino Murta leomurta@gmail.com Introdução a HTML Formulários em HTML Critério para escolha de campos Agenda Leonardo Murta HTML 2 HTML HyperText Markup Language Criada por Tim Berners-
TECNOLOGIA WEB. XHTML Aula 5. Profa. Rosemary Melo
TECNOLOGIA WEB XHTML Aula 5 Profa. Rosemary Melo HTML (Hiper Text Markup Language) Linguagem de marcação de hipertexto Comum especificar o conteúdo do documento e sua formatação em um só documento HTML.
PROVA DE MICROINFORMÁTICA
16 PROVA DE MICROINFORMÁTICA PARA RESPONDER ÀS QUESTÕES DE 41 A 60, CONSIDERE A CONFI- GURAÇÃO PADRÃO DO SISTEMA OPERACIONAL MICROSOFT WINDOWS ME E DOS APLICATIVOS WINDOWS EXPLORER, INTERNET EXPLORER,
Links, Imagens e Tabelas
Links, Imagens e Tabelas Criar um link em um texto significa estabelecer uma ligação com outra página, outro texto, que o leitor pode abrir clicando numa palavra, grupo de palavras ou em uma imagem. Para
Formulários [8] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira
![Formulários [8] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira](/thumbs/68/58571051.jpg "Formulários [8] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira")
Desenvolvimento e Design de Websites Prof.: Ari Oliveira Formulários: Tag form Campos: Texto, Senha, checkbox, radio, botões, textarea e menu select. 2 Crie uma Tabela de Horários Faça seu horário semanal,
Microsoft Word 2010 NORMA ABNT para Trabalhos Acadêmicos Conceitos Básicos
Microsoft Word 2010 NORMA ABNT para Trabalhos Acadêmicos Conceitos Básicos contato@suptecinfo.com.br SUMÁRIO Iniciando o Word... 1 Conhecendo a Ferramenta... 1 Menu Layout da Página... 2 Capa... 3 Folha
FORMATAÇÃO: WRITER. Avalie esse tutorial
FORMATAÇÃO: WRITER 2018 Se tiver sugestões para nossos tutoriais, checklist ou modelos, envie-as para biblioteca.ippri@unesp.br, para que possamos aprimorá-los. Agradecemos a colaboração! Consulte sempre
HTML Página 23. Índice
PARTE - 4 HTML Página 23 Índice HTML - Frames... 24 Exemplo:... 24 Parâmetros utilizados para a marcação ... 25 Composições com Frames... 25 Exemplo 1.... 26 Exemplo 4.... 26 Parâmetros que Completam
HTML. Conceitos básicos de formatação de páginas WEB
HTML Conceitos básicos de formatação de páginas WEB HTML HyperText Markup Language Linguagem utilizada para criar hipertexto na web Ou seja, criar documentos estruturados utilizando para tal um conjunto
Dreamweaver CC_15x21.indd 1 06/04/ :04:22
Dreamweaver CC_15x21.indd 1 06/04/2015 11:04:22 SUMÁRIO INTRODUÇÃO... 3 CAPÍTULO 1 Iniciando e conhecendo o Dreamweaver... 8 Interfaces... 21 Criando e configurando sites... 22 CAPÍTULO 2 Criando arquivos...
Dezembro/2012. Universidade Federal Fluminense. Curso de Introdução ao HTML. SeTel- Grupo PET-Tele. Adicionando links e imagens. Tabelas.
Universidade Federal Fluminense Dezembro/2012 1 2 3 4 5 6 7 8 Informações principais Base da Web: - Um esquema de nomes para localização de fontes de informação na Web : URL. - Um Protocolo de acesso para
1 Introdução ao HTML e formatação de texto
1 Introdução ao HTML e formatação de texto Vinicius A. de Souza va.vinicius@gmail.com São José dos Campos, 2011. 1 Sumário Desenvolvimento Web Introdução...3 Uma visão geral do HTML...3 Estrutura do documento...3
Tarlis Portela Web Design HTML
Tarlis Portela Web Design HTML HTML Definição HTML (acrônimo para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) ; É uma linguagem de marcação utilizada
Síntese da aula anterior
Síntese da aula anterior Na última aula, aprendemos a utilizar em html: Tabelas Hiperligações Foi também disponibilizado um formulário de ajuda em html com as tags principais Sítio da aula anterior: http://www.marcosoares.com/aia/11/aula_2010_04_16/
Aula 6: Frames. Pré-requisitos: Os temas das aulas 2 e 5, e a forma como se define cores apresentada na aula 4, serão muito importantes para frames.
Aula 6: Frames Você certamente já visitou páginas organizadas em áreas diferenciadas que podiam ser usadas, redimensionadas movidas para cima ou para baixo independentemente. Pois essa possibilidade de
Linguagem HTML: Frames
Linguagem HTML: Frames Prof. André Constantino da Silva Prof. Rodolfo Francisco de Oliveira IAM 1 semestre de 2012 15 de maio de 2012 Aula de Hoje Divisão da janela em partes para exibir várias páginas
3. Construção de páginas web Introdução ao HTML
3. Construção de páginas web 3.1. Introdução ao HTML 1 Introdução ao HTML O HTML, HyperText Markup Language, foi desenvolvido para especificar a organização lógica de um documento com extensões de hipertexto,
CURSO MÍDIAS NA EDUCAÇÃO Módulo Informática/Internet
CURSO MÍDIAS NA EDUCAÇÃO Módulo Informática/Internet Orientações: Como construir um tutorial utilizando o modelo htm: Figura 11. Padrão de Tutorial. Nosso objetivo é construir, através de um modelo pré-estabelecido,
10 Hiperlinks e Mala Direta
1 Word 2013 10 Hiperlinks e Mala Direta 10.1. Hiperlinks 10.1.1. Criar um Hiperlink 10.1.2. Criar um Hiperlink Para Outro Documento 10.1.3. Criar Ligação Dentro do Documento 10.1.4. Remover Hiperlinks
Autoria Web. Professor: Diego Oliveira. Conteúdo 03: Tags de Formulário
Autoria Web Professor: Diego Oliveira Conteúdo 03: Tags de Formulário Caminhos Os caminhos dentro de um projeto HTML podem ser Relativos ou Absolutos O caminho Relativo é o caminho a partir da página em
CURSO DE TUTORIAL 2 DE 5. Robson Santos da Silva
CURSO DE TUTORIAL 2 DE 5 Espero que você tenha gostado do Tutorial 1. Mas... Caso queira saber ainda mais sobre o Moodle e seu potencial quando utilizado com diferentes recursos que a Web 2.0 oferece gratuitamente...
I. A LINGUAGEM HTML II. TAGS ESTRUTURA BÁSICA DE UM DOCUMENTO HTML
I. A LINGUAGEM HTML A linguagem HTML (Hyper Text Markup Language Linguagem de Marcação de Hipertexto) é uma linguagem utilizada para produzir páginas na Web (WWW World Wide Web), criada por Tim Berners-Lee
Roteiro 01. Professor: Prof. M.Sc. Odilon Corrêa da Silva. Curso: Desenvolvimento de Sistemas. Disciplina: Programação para WEB I
Roteiro 01 Professor: Prof. M.Sc. Odilon Corrêa da Silva Curso: Desenvolvimento de Sistemas Disciplina: Programação para WEB I Roteiro 01 Objetivos Apresentar os conceitos básicos do HTML Conhecer os recursos
Fábio Borges de Oliveira. HTML HyperText Markup Language
Fábio Borges de Oliveira HTML HyperText Markup Language Iniciando Código É a primeira tag de um documento HTML, nas primeiras versões dos browsers essa tag era obrigatória. Propriedade que
Programação para Internet I
Programação para Internet I Aula 05 e 06 Fernando F. Costa nando@fimes.edu.br 1 Tags de Formatação de Texto - Permite que um texto se mova de um lado para o outro da página. Sintaxe:
MÓDULO 1: Tags: estrutura; tipos; atributos. Estrutura de um documento. Tags de blocos: <?xml?>, <!DOCTYPE>, <html>, <head>, <body>, <body bgcolor>.
MÓDULO 1: Tags: estrutura; tipos; atributos. Estrutura de um documento. Tags de blocos: , , , , , . Conceitos básicos do funcionamento da Internet Internet
Geralmente uma página com frames é constituída por dois ou três elementos básicos:
Objectivos da actividade: Frames Exemplos de frames Com 2 ficheiros Com 3 ficheiros 2 colunas 2 linhas 2 colunas a 2a. com 2 linhas 2 linhas a 2a. com 2 colunas Geralmente uma página com frames é constituída
Projeto Integrador. Pesquisa HTML5. Green Friday. Gestão em Tecnologia da Informação. Turma 1º B
Projeto Integrador Green Friday Pesquisa HTML5 Gestão em Tecnologia da Informação Turma 1º B Versão : 1.0.0 Equipe Cristiano Margarida Rodrigues Idealização e arquitetura Tiago Dariel Gois Marques - Teste
Tabelas. Uma célula de dados pode conter texto, imagens, listas, parágrafos, formulários, linhas horizontais, etc. <table> <tr>
Tabelas HTML Tabelas Tabelas São definidas pela tag Uma tabela é dividida em linhas -com a tag Cada linha divida em células de dados (com a tag ). As letras td são um acronimo
PROCEDIMENTO DO CLIENTE
PROCEDIMENTO DO CLIENTE Título: Plug-in Slide Show Objetivo: Aprender a utilizar a ferramenta. Onde: Empresa Quem: Cliente Quando: Início A ferramenta de Slide show permite a criação de apresentações animadas
3 Cabeçalho/ logótipo 4 Menu principal 5 Autenticação
Escolas de Primeiro Ciclo no site do Agrupamento Iniciar com o endereço www.aecarvalhos.pt 1 1 Clicar em ESCOLAS DO AGRUPAMENTO (lado direito do site). 2 2 Apontar para EB1/JI e clicar na escola respetiva.
HTML: INTRODUÇÃO TAGS BÁSICAS
HTML: INTRODUÇÃO TAGS BÁSICAS CURSO TÉCNICO DE INFORMÁTICA MODALIDADE SUBSEQÜENTE DESENVOLVIMENTO WEB I PROF. ALEXANDRO DOS SANTOS SILVA 1 1 SUMÁRIO Definição Editores HTML Estrutura básica de um documento
TECNOLOGIA WEB INTRODUÇÃO CONSTRUÇÃO DE PÁGINAS ESTÁTICAS HTML / XHTML
INTRODUÇÃO CONSTRUÇÃO DE PÁGINAS ESTÁTICAS HTML / XHTML 1 INTRODUÇÃO TECNOLOGIA WEB Começaremos desvendando o poder do desenvolvimento de aplicações baseadas na Web com a XHTML (Extensible HyperText Markup
Tela do MS Word 2010 Barra de Título Régua Horizontal Menu Arquivo Grupo Janela de Documento Guia Barra de Ponto de Ferramentas Inserção de Acesso
1 Tela do MS Word 2010 Título Menu Arquivo Ferramentas de Acesso Rápido Guia Grupo Régua Horizontal Janela de Documento Ponto de Inserção Régua Vertical Rolagem Vertical Zoom Status Botões de Visualização
Centro de Competência Entre Mar e Serra
1. Como utilizar o Moodle 1.1. O Editor de Texto do Moodle Ao longo do seu trabalho no Moodle irá encontrar vários dos campos das janelas de introdução de dados que permitem texto formatado, mediante um
Apostila H T M L vers. 7
Apostila H T M L vers. 7 Índice 1) Criador e criação 2) Html 3) Criando sua primeira página html 4) Exemplo completo 5) Passo 2 6) Hyperlinks 7) Texto dentro de uma caixa 8) Formatar o texto 9) Tag visível
Aplicação para Web I. Manipulando Imagens e Links
Aplicação para Web I Manipulando Imagens e Links Antes de começar O HTML também é uma linguagem de programação, então deve ser organizada de forma identada também. Estamos aprendendo agora a linguagem
Curso de HTML aula 4. Sumário. 1 Formulários. 1.1 Construindo formulários com o FORM. 1.2 Método:
Sumário 1 Formulários... 1 1.1 Construindo formulários com o FORM... 1 1.2 Método:... 1 1.3 INPUT... 2 2 Outros valores para type... 3 2.1 TYPE="RADIO"... 3 2.2 TYPE="PASSWORD"... 3 2.3 TYPE="CHECKBOX"...
Roteiro de Estudos e Atividades Avaliativas HTML
Roteiro de Estudos e Atividades Avaliativas HTML Faça essa atividade de forma individual ou em dupla, faça o máximo de questões que conseguir. Pesquise na Web o significado das tags e utilize-as para alcançar
Conhecendo a aba Início
Conhecendo a aba Início Grupo: Células... pág. 2 1º Exercício... pág. 6 Grupo: Alinhamento... pág. 7 2º Exercício... pág. 7 Grupo: Número... pág. 8 3º Exercício... pág. 9 Grupo: Fonte... pág. 10 4º Exercício...
Tutorial Cold Fusion Módulo 2 Cold Fusion Brasil -
www.coldfusionbrasil.com.br 2000 ENTENDENDO MAIS SOBRE CFOUTPUT 3 USO DO PARÂMETRO GROUP 3 USO DO PARÂMETRO GROUPCASESENSITIVE 4 USO DO PARÂMETRO STARTROW 4 USO DO PARÂMETRO MAXROWS 4 CRIANDO FORMULÁRIOS
Este exercício será parecido com a montagem de um projeto real, onde trabalhamos com vários arquivos XHTML e um único arquivo CSS.
Este exercício será parecido com a montagem de um projeto real, onde trabalhamos com vários arquivos XHTML e um único arquivo CSS. 1) Crie uma pasta chamada com_estilo e salve dentro dela os arquivos obrigado.html
INSTRUÇÕES PARA MONTAR UM TESTE DE MÚLTIPLA ESCOLHA
INSTRUÇÕES PARA MONTAR UM TESTE DE MÚLTIPLA ESCOLHA Iniciando o programa Quando você baixa o arquivo do programa, aparece uma pasta dentro da qual existem alguns arquivos. Eles estão representados na figura
Criando Mensagens - Editor Drag and Drop
Criando Mensagens - Editor Drag and Drop AKNA TREINAMENTOS AKTR01002000401 1/17 Sumário Criando Mensagens Editor Drag and Drop O que é?... 3 Pra que serve?... 3 Criando a mensagem... 3 Componentes... 5
Linguagem WEB Prof. Alexandre Unterstell alexunter@gmail.com - www.alex.inf.br/cesc
Linguagem WEB Prof. Alexandre Unterstell alexunter@gmail.com - www.alex.inf.br/cesc Dicas Importantes: - Sempre crie um diretório em seu computador e salve todos os arquivos que vai usar (imagens e paginas),
Curso PHP Básico. Jairo Charnoski do Nascimento
Curso PHP Básico Jairo Charnoski do Nascimento Agenda Ferramentas necessárias Introdução HTML HTML? Tags Construindo seu primeiro website Observações sobre a estrutura Mais tags Atributos Agenda Cores