Apostila de Introdução à Linguagem HTML - Disponibilização de Conteúdos na WEB -
|
|
|
- Giovana Guimarães Ferreira
- 8 Há anos
- Visualizações:
Transcrição
1 Apostila de Introdução à Linguagem HTML - Disponibilização de Conteúdos na WEB - Profa. Flávia Pereira de Carvalho Taquara - RS
2 Sumário Apostila de HTML - Fonte: Página 1 INTRODUÇÃO À LINGUAGEM HTML EDIÇÃO DE DOCUMENTOS HTML PUBLICAÇÃO DE DOCUMENTOS NA INTERNET (SITES) DOCUMENTO HTML BÁSICO E SEUS COMPONENTES SEÇÃO <HEAD> SEÇÃO <BODY> ATRIBUTOS DE <BODY> FONTES CABEÇALHOS ANINHAMENTO DE CABEÇALHOS ALINHAMENTO DE CABEÇALHOS SEPARADORES QUEBRA DE LINHA PARÁGRAFOS LINHA HORIZONTAL COMENTÁRIOS LISTAS EM HTML LISTAS COM MARCADORES LISTAS NUMERADAS LISTAS E SUB-LISTAS FORMATAÇÃO DE FRASES MARQUEE LIGAÇÕES (USO DE LINKS) ATRIBUTOS CAMINHOS INDICADORES INSERÇÃO DE IMAGENS ATRIBUTOS BÁSICOS DE IMAGEM MOLDURAS DE IMAGEM TABELAS ELEMENTOS BÁSICOS DE TABELAS TÍTULOS, LINHAS E ELEMENTOS UMA TABELA SIMPLES TÍTULOS COMPREENDENDO MAIS DE UMA COLUNA OU LINHA TABELAS SEM BORDA EXTENSÕES DE TABELAS FORMULÁRIOS HTML CRIANDO UM FORM PARÂMETROS DO FORM ELEMENTOS DO FORM TRABALHANDO COM OS DADOS ENVIADOS PELO FORM COLOCANDO EM PRÁTICA Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 2
3 1 Introdução à Linguagem HTML HTML (HyperText Markup Language - Linguagem de Formatação/Marcação de Hipertexto) é fruto do "casamento" dos padrões HyTime e SGML. HyTime - Hypermedia/Time-based Document Structuring Language: HyTime (ISO 10744:1992) - padrão para representação estruturada de hipermídia e informação baseada em tempo. Um documento é visto como um conjunto de eventos concorrentes dependentes de tempo (áudio, vídeo, etc.), conectados por webs ou hiperlinks. O padrão HyTime é independente dos padrões de processamento de texto em geral. Ele fornece a base para a construção de sistemas hipertextos padronizados, consistindo de documentos que aplicam os padrões de maneira particular. SGML - Standard Generalized Markup Language: Padrão ISO 8879 de formatação de textos: não foi desenvolvido para hipertexto, mas torna-se conveniente para transformar documentos em hiperobjetos e para descrever as ligações. SGML não é padrão aplicado de maneira padronizada: todos os produtos SGML têm seu próprio sistema para traduzir as etiquetas (tags) para um particular formatador de texto. DTD - Document Type Definition: Define as regras de formatação para uma dada classe de documentos. Um DTD ou uma referência para um DTD deve estar contido em qualquer documento conforme o padrão SGML. Portanto, HTML é definido segundo um DTD de SGML. Todo documento HTML apresenta elementos entre parênteses angulares (< e >). Esses elementos são as etiquetas (tags) de HTML, que são os comandos de formatação da linguagem. A maioria das etiquetas tem sua correspondente de fechamento, representada com uma barra ( / ): <etiqueta> texto a ser formatado </etiqueta> Isso é necessário porque as etiquetas servem para definir a formatação de uma porção de texto, e assim marcamos onde começa e onde termina o texto com a formatação especificada por ela. Alguns elementos são chamados vazios, pois não marcam uma região de texto, apenas inserem alguma coisa no documento, não havendo a necessidade do fechamento: Todos os elementos podem ter atributos: <etiqueta> <etiqueta atributo1=valor1 atributo2=valor2>...</etiqueta> HTML é um recurso muito simples e acessível para a produção de documentos. Nesta apostila, será possível aprender uma introdução aos seus elementos. Dica: Não existem programas em HTML, pois HTML não é uma linguagem de programação, mas de formatação (marcação). Portanto, a rigor, não existem "programadores" de HTML. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 3
4 2 Edição de Documentos HTML Existem Editores HTML chamados WYSIWYG (what you see is what you get - o que você vê é o que você tem). Eles oferecem ambiente de edição com um resultado final das marcações (pois o resultado final depende do browser 1 usado para visitar a página). Alguns bastante conhecidos são, por exemplo: FrontPage e Dreamweaver. Figura 1 Tela do FrontPage Além dos editores específicos para HTML, Editores de Textos bastante utilizados, como o Word, entre outros, permitem a exportação de seus documentos próprios para o formato HTML (menu Arquivo, Salvar como, Salvar_como Tipo). Um documento HTML, normalmente terá extensão.html ou.htm. Existem vários Editores HTML Online, como por exemplo: Online HTML Editor, Mozilla Thimble, entre outros. 1 Browser: Navegador Internet. Exemplos: Internet Explorer, Mozilla Firefox, Chrome etc. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 4
5 3 Publicação de Documentos na Internet (Sites) Para que uma página esteja permanentemente disponível na Web, ela precisa ter um endereço fixo, alojada em um servidor. Existem vários provedores de espaço (hosting) gratuitos e também os provedores de acesso geralmente oferecem espaço para os sites de seus assinantes. Sites com fins lucrativos geralmente são hospedados em provedores de espaço pagos. Definida a hospedagem, basta enviar para o provedor os arquivos de seu site (via FTP 2 ou por uma página de envio no próprio provedor de espaço) e suas páginas já estarão disponíveis para visitas no mundo todo. Um programa bastante usado para envio de arquivos de um computador local para um servidor e vice-versa, através do Windows, é o WinSCP. Em geral, tem-se como arquivo da página inicial, o arquivo chamado index.html. Esse é o arquivo default (padrão) em um diretório. Ao entrar em uma URL que não especifica um arquivo em um diretório, o browser solicita ao servidor o arquivo index.html. É por isso que se pode escrever tanto ou Se não existir um arquivo chamado index.html, o servidor poderá retornar uma mensagem de "acesso proibido à listagem do diretório" ou então retornar a listagem dos arquivos daquele diretório, o que pode não ser o que se deseja. Esse arquivo default é definido na configuração do servidor WWW. 2 FTP - File Transfer Protocol: Protocolo de Transferência de Arquivos. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 5
6 4 Documento HTML Básico e seus Componentes A estrutura de um documento HTML apresenta os seguintes componentes básicos: <html> <head> <meta charset="utf-8"> <title> Título do Documento </title> </head> <body> textos, imagens, links, etc... </body> </html> Figura 2 Componentes Básicos de um Documento HTML As etiquetas (tags) HTML não são sensíveis à caixa (a linguagem HTML não é case sensitive), ou seja, tanto faz escrever <HTML>, <Html>, <html>, <HtMl>, etc. Não tem diferença entre maiúsculas e minúsculas. Mas, a prática da boa programação diz que deve-se usar letras minúsculas no código fonte de páginas web e também de programas em geral. Os documentos HTML se dividem em seções, apresentadas nos capítulos a seguir. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 6
7 5 Seção <HEAD> <HEAD> contém informações sobre o documento. A etiqueta HTML <meta charset="utf-8"> significa que: meta é usado para declarar metadados (informações sobre a própria página, como resumo do conteúdo, palavras-chaves, indicações a robôs de busca, entre outras), charset é usado para indicar o formato de codificação de caracteres usado no document e utf-8 é um formato de codificação, ou seja, é usado para mostrar ao navegador o tipo de codificação que será utilizada no site e, assim, funcionar corretamente todas acentuações, por exemplo. O elemento <TITLE> define um título, que é mostrado no alto da janela do browser. Exemplo: <head> <title> Página do Fulano de Tal </title> </head> Todo documento web deve ter um título; esse título é referenciado em buscas pela rede, dando uma identidade ao documento. Ao adicionar uma página aos seus Favoritos (Bookmarks), o título da página se torna a âncora de atalho para ela. Por isso é sugerido que os títulos dos documentos sejam sugestivos, evitando-se títulos genéricos como "Introdução", por exemplo. O título também é bastante significativo para a listagem de uma página nos resultados de pesquisas nos sites de busca da Internet. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 7
8 6 Seção <BODY> Tudo que estiver contido em <BODY> será mostrado na janela principal do browser, sendo apresentado ao leitor. <BODY> pode conter cabeçalhos, parágrafos, listas, tabelas, links para outros documentos, imagens, formulários, animações, vídeos, sons e scripts embutidos. 6.1 Atributos de <BODY> Através de atributos de <BODY>, é possível definir cores para os textos, links e para o fundo das páginas, bem como uma imagem de fundo (marca d água): <body bgcolor="#rrggbb" text="#rrggbb" link="#rrggbb" alink="#rrggbb" vlink="#rrggbb" background="url"> Onde: BGCOLOR: Background Color, ou seja, cor de fundo da página. Quando não é indicada a cor de fundo, o browser irá mostrar uma cor padrão, geralmente cinza ou branco. TEXT: Cor dos textos da página (padrão: preto). LINK: Cor dos links (padrão: azul). ALINK: Cor dos links quando acionados, clicados (padrão: vermelho). VLINK: Cor dos links depois de visitados (padrão: azul escuro ou roxo). Os valores dos atributos são dados em hexadecimal, equivalentes a cores no padrão RGB (Red, Green, Blue). Existem tabelas de cores com esses valores, mas grande parte dos editores já oferece uma interface bem amigável através da qual é possível escolher as cores desejadas, sem se preocupar com números esdrúxulos tais como #FF80A0. Browsers que seguem a definição de HTML 3.2 em diante, também aceitam 16 nomes de cores, tirados da paleta VGA do Windows - por exemplo, podemos escrever BGCOLOR="BLUE". Porém, browsers mais antigos não apresentarão as cores indicadas. BACKGROUND: Indica o URL 3 da imagem a ser replicada no fundo da página, como uma marca d água. Para efeitos de design, é possível fixar a imagem de fundo, para que ela não se mova junto com o texto ao se rolar a página. Esse efeito não é padrão e funciona no Internet Explorer. Dica: Os nomes das cores - os 16 nomes de cores aceitos desde a versão 3.2 da HTML são estes: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow. 3 URL: O sistema de endereçamento da Web é baseado em uma sintaxe chamada URI (Universal Resource Identifier - Identificador Universal de Recursos). Os endereços que utilizamos atualmente são os URLs, que seguem essa sintaxe. URL significa Uniform Resource Locator - Localizador Uniforme de Recursos. Um exemplo de URL é: Esse endereço identifica: o protocolo de acesso ao recurso desejado (http) e a máquina a ser acessada ( Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 8
9 7 Fontes Atributos das fontes: Cores As cores são introduzidas através do elemento <FONT>, usando o sistema RGB para cores (da mesma forma que vimos para cores de documentos), como mostrado no exemplo a seguir: <font color="red"> Texto </font> Produzirá na página: a palavra Texto escrita na cor vermelha. Assim, um trecho de texto pode ter uma cor diferente da definição geral de cores, feita através dos atributos de <BODY>. Tamanhos Veja a formatação a seguir: produzirá na página: a palavra Texto como o tamaho 3. <font size=3> texto </font> Este comando permite que o autor do documento altere o tamanho das letras em trechos específicos de texto. O tamanho básico dos textos é 3 (padrão). Pode-se indicar tamanhos relativos a esse, por exemplo: <font size=+2> Letra maior </font> Letra normal <font size=-2> Letra menor </font> Na página web apareceria assim : Tipos de Letra Uma evolução que permite a escolha da fonte para os textos (tipo de letra), é o atributo FACE: <font face="arial"> Texto </font> Produzirá: a palavra Texto com a fonte (tipo de letra) Arial. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br - 9
10 Mais exemplos: <font face="verdana" color="blue"> Fonte Verdana Azul </font> Fonte Verdana Azul <font face="arial" color="green"> Fonte Arial Verde </font> Fonte Arial verde <font face="courier new" color="red"> Fonte Courier New Vermelha </font> Fonte Courier New Vermelha Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
11 8 Cabeçalhos Há seis níveis de cabeçalhos em HTML, de <H1> a <H6>, que servem para colocar títulos e subtítulos nas páginas web: <H1> Este é um cabeçalho de nível 1 </H1> <H2> Este é um cabeçalho de nível 2 </H2> <H3> Este é um cabeçalho de nível 3 </H3> <H4> Este é um cabeçalho de nível 4 </H4> <H5> Este é um cabeçalho de nível 5 </H5> <H6> Este é um cabeçalho de nível 6 </H6> Esses cabeçalhos são mostrados no browser da seguinte forma: 8.1 Aninhamento de cabeçalhos Os cabeçalhos não podem ser aninhados, isto é, a formatação: <H2>Este é <H1>um cabeçalho de nível 1</H1> dentro de um cabeçalho de nível 2</H2> Pode produzir algum resultado próximo ao desejado: Este é um cabeçalho de nível 1 dentro de um cabeçalho de nível 2 Mas o mais comum é que os browsers "entendam" essa formatação como sendo: <H2>Este é</h2> <H1>um cabeçalho de nível 1</H1> dentro de um cabeçalho de nível 2</H2> Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
12 Ou seja, como se estivesse faltando uma etiqueta de fechamento de <H2> antes de <H1> e faltando uma abertura de <H2> depois do fechamento de <H1>, oferecendo o seguinte resultado: Este é um cabeçalho de nível 1 dentro de um cabeçalho de nível 2 Os editores WYSIWYG naturalmente não permitem o aninhamento de cabeçalhos. 8.2 Alinhamento de cabeçalhos Os cabeçalhos têm atributos de alinhamento: <h2 align=center> Cabeçalho Centralizado </h2> Cabeçalho centralizado <h3 align=right> Cabeçalho alinhado à direita </h3> Cabeçalho alinhado à direita <h4 align=left> Cabeçalho alinhado à esquerda </h4> Cabeçalho alinhado à esquerda (default = padrão) Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
13 9 Separadores As quebras de linha do texto fonte não são significativas na apresentação de documentos em HTML, ou seja, ao dar Enter no código fonte da página web nos comandos HTML, o resultado da página no navegador não é alterado, o navegador não reconhece o Enter como quebra de linha. Para organizar os textos são necessários separadores, apresentados a seguir. 9.1 Quebra de linha Quando deseja-se mudar de linha, deve-se usar o elemento <BR>. Isso só é necessário quando precisa-se de uma quebra de linha em determinado ponto, pois os browsers já quebram as linhas automaticamente para apresentar os textos. Vem da palavar break. Com sucessivas etiquetas <BR>, pode-se inserir diversas linhas em branco nos documentos. Esse elemento tem um atributo especial, que será apresentado no item sobre inserção de imagens. 9.2 Parágrafos Para separar blocos de texto, usa-se o elemento <P>, por exemplo: <p>parágrafo 1;</p> <p>parágrafo 2.</p> Que produz o seguinte resultado na página web: Parágrafo1; Parágrafo2. Combinando parágrafos e quebras de linha, tem-se, por exemplo: Parágrafo 1;<br> linha 1 do parágrafo 1, <br>linha 2 do parágrafo 1.<P>Parágrafo 2;<br> linha 1 do parágrafo 2, <br>linha 2 do parágrafo 2. O resultado da marcação acima é: Parágrafo 1; linha 1 do parágrafo 1, linha 2 do parágrafo 1. Parágrafo 2; linha 1 do parágrafo 2, linha 2 do parágrafo 2. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
14 <P> tem atributo de alinhamento, semelhante aos cabeçalhos, como nos exemplos a seguir: <p align=center> Assim como os trens, as boas ideias às vezes chegam com atraso. <br> (Giovani Guareschi) </p> Assim como os trens, as boas ideias às vezes chegam com atraso. (Giovani Guareschi) <p align=right> Como diz o provérbio chinês: É melhor passar por ignorante uma vez do que permanecer ignorante para sempre. </p> Como diz o provérbio chinês: É melhor passar por ignorante uma vez do que permanecer ignorante para sempre. <p align=left> Este é o alinhamento padrão (default) e, por isso, não vou colocar nenhuma frase especial.</p> Este é o alinhamento padrão (default) e, por isso, não vou colocar nenhuma frase especial. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
15 10 Linha Horizontal <hr> insere uma linha horizontal, como a apresentada abaixo: Essa linha tem diversos atributos, oferecendo resultados diversos: <hr size=10> insere uma linha de largura 10 (pixels): <hr width=50%> insere uma linha que ocupa 50% do espaço horizontal disponível: <hr width=30% align=right noshade> insere uma linha de comprimento 30% (do espaço horizontal disponível), alinhada à direita, sem efeito tridimensional: <hr size=70 width=2 align=left> insere uma linha de largura 70 (pixels), comprimento 2 (pixels), alinhada à esquerda (o Netscape, aparentemente, não aceita esta formatação de <HR>): Dica: Divisões - outros elementos usados para separar porções de texto são o <DIV> e o <CENTER>. <CENTER> centraliza os elementos (textos, imagens, tabelas) que estiverem dentro de sua marcação. <DIV> marca uma divisão lógica de um documento e é uma formatação bastante usada atualmente. 11 Comentários Para fazer algum comentário no código fonte HTML usa-se a seguinte notação: <!-- blá blá blá --> Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
16 12 Listas em HTML Há dois tipos de listas em HTML, apresentadas a seguir: 12.1 Listas com Marcadores São equivalentes às listas com marcadores do MS-Word, por exemplo: <UL> <LI> item de uma lista <LI> item de uma lista, que pode ser tão grande quanto se queira, sem que seja necessário se preocupar com a formatação das margens de texto <LI> item </UL> item de uma lista item de uma lista, que pode ser tão grande quanto se queira, sem que seja necessário se preocupar com a formatação das margens de texto item A diferença entre o resultado da marcação HTML e de um Editor de Textos está na mudança dos marcadores, assinalando os diversos níveis de listas compostas: <UL> <LI> Documentos básicos <LI> Documentos avançados <UL> <LI> formulários <UL> <LI> CGI </UL> <LI> contadores <LI> relógios </UL> <LI> Detalhes sobre imagens </UL> Documentos básicos Documentos avançados o formulários CGI o contadores o relógios Detalhes sobre imagens Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
17 12.2 Listas Numeradas <OL> <LI> item de uma lista numerada <LI> item de uma lista numerada, que pode ser tão grande quanto se queira, sem que seja necessário se preocupar com a formatação das margens de texto <LI> item de lista numerada </OL> 1. item de uma lista numerada 2. item de uma lista numerada, que pode ser tão grande quanto se queira, sem que seja necessário se preocupar com a formatação das margens de texto 3. item de lista numerada Estas listas não apresentam numeração em formato 1.1, 1.2, etc., quando compostas apresentam-se da seguinte forma: 1. Documentos básicos 2. Documentos avançados 1. formulários 1. CGI 2. contadores 3. relógios 2. Detalhes sobre imagens Porém, através do atributo TYPE (HTML 3.2), pode-se lidar com a numeração dos itens: <OL TYPE=I> <LI> Documentos básicos <LI> Documentos avançados <OL TYPE=a> <LI > formulários <OL TYPE=i> <LI>CGI </OL> <LI> contadores <LI> relógios </OL> <LI> Detalhes sobre imagens </OL> I. Documentos básicos II. Documentos avançados a. formulários i. CGI b. contadores c. relógios III. Detalhes sobre imagens Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
18 Ainda segundo HTML 3.2, o atributo START pode indicar o início da numeração da lista: <OL START=4 TYPE=A> <LI> um item <LI> outro item <LI> mais um item </OL> D. um item E. outro item F. mais um item 12.3 Listas e sub-listas As listas podem ser aninhadas. Por exemplo: <DL> <DT> termo a ser definido <DD> definição <OL> <LI> item de uma lista numerada <LI> item de uma lista numerada <UL> <LI> item de uma lista </UL> <LI> item de uma lista numerada </OL> <DT> termo a ser definido <DD> definição </DL> termo a ser definido definição 1. item de uma lista numerada 2. item de uma lista numerada o item de uma lista 3. item de uma lista numerada termo a ser definido definição Dica: Se você não está vendo diferença alguma entre as listas comuns e as que têm atributos TYPE, isso se deve ao fato de seu browser não estar reconhecendo esses atributos como válidos. Trata-se de um browser de versão antiga. Isso deve ser pensado ao usar atributos mais recentes: nem todo usuário poderá ver o resultado das novas marcações. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
19 13 Formatação de Frases <b> Quando disponível no browser, é mostrado em negrito (em alguns browsers, pode aparecer sublinhado). <i> Itálico <u> Sublinhado. Deve ser usado com cuidado, pois confunde-se com a apresentação de links. <strike> ou <s> Frase riscada. <big> Fonte um pouco maior. <small> Fonte um pouco menor. <sub> Frase em estilo índice, como em H2O, por exemplo. <sup> Frase em estilo expoente, como em Km 2, por exemplo. 14 Marquee É possível obter o efeito de animação de texto, através da formatação <marquee>. <marquee behavior = efeito> Texto </marquee> Atributos de largura e direção do efeito permitem diversas apresentações diferentes, por exemplo: <marquee behavior=scroll width=30%> Texto </marquee> <marquee behavior=slide direction=right> Texto </marquee> <marquee behavior=slide direction=left> Texto </marquee> Atenção: O efeito Marquee só é executado no Internet Explorer e em versões recentes do Netscape - e de maneiras diferentes. Comando muito antigo e fora de uso!!!! Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
20 15 Ligações (uso de Links) Com HTML é possível fazer ligações de uma região de texto (ou imagem) a um outro documento (ou a outra parte do próprio documento). Você já deve ter visto em alguma página internet exemplos dessas ligações: o browser destaca essas regiões e imagens do texto, indicando que são ligações de hipertexto - também chamadas hypertext links ou hiperlinks ou simplesmente links, onde normalmente, o mouse vira uma mãozinha e ao clicar chama-se (abre-se) um outro documento, página web ou figura por exemplo. Para inserir um link em um documento, utiliza-se a etiqueta <a>, da seguinte forma: <a href = "arquivo_destino"> âncora </a> Onde: arquivo_destino: é o endereço do documento de destino, da página ou imagem a qual deseja-se abrir. âncora: é o texto ou imagem que servirá de ligação hipertexto do documento sendo apresentado para o documento de destino Atributos <a> tem vários atributos que são utilizados de acordo com a ação associada ao link. Os mais usados são apresentados a seguir: HREF: Indica o arquivo de destino da ligação de hipertexto. TARGET: Indica o quadro (frame) em que será carregado o arquivo_destino. Exemplo: target="_blank" NAME: Marca um indicador, isto é, uma região de um documento como destino de uma ligação. Maiores detalhes na seção sobre indicadores. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
21 15.2 Caminhos Os links podem estar indicados como caminhos relativos ou absolutos. Caminho Relativo O caminho relativo pode ser usado sempre que for necessário fazer referência a um documento armazenado no mesmo servidor do documento atual. Através do campo de endereços do browser, é possível identificar se um documento (página) que está sendo visualizado está dentro de algum diretório (pasta). Como por exemplo, se estivermos em um browser acessando a página da FACCAT e vemos o seguinte endereço: O que pode-se concluir é que o documento que está sendo visualizado no momento, chamado apostila_de_informatica.html, está localizado dentro de um diretório (pasta) chamado apostilas do servidor Então, para escrever, por exemplo um link deste documento (apostila_de_informatica.html) para um documento chamado doc.html que está localizado no diretório /apostilas/documentos/ do mesmo servidor é necessário escrever: <a href="documentos/doc.html"> exemplo de caminho relativo </a> Para usar links com caminhos relativos é preciso, portanto, conhecer a estrutura do diretório do servidor no qual se está trabalhando, pois deve-se indicar todo o caminho onde está o documento no qual está se referindo no link. Quando há alguma dúvida, o melhor é usar o caminho absoluto. Caminho Absoluto Utiliza-se o caminho absoluto quando se deseja referenciar um documento que esteja em outro servidor, por exemplo: <a href=" FACCAT - Faculdades de Taquara </a> Que oferece um link FACCAT - Faculdades de Taquara que ao ser clicado com o mouse abrirá a página cujo endereço é Com a mesma sintaxe, é possível escrever links para qualquer servidor de informações da Internet. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
22 15.3 Indicadores O atributo NAME permite indicar um trecho de documento como ponto de chegada de uma ligação hipertexto (link). A formatação: <a name="inicio"> Indicadores (uso de links) </a> faz com que a âncora Indicadores (uso de links) seja o destino de um link. Ao escrever: <a href="#inicio"> Topo do Documento </a> tem-se uma ligação hipertexto para um trecho deste mesmo documento. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
23 16 Inserção de Imagens O elemento IMG insere imagens que são apresentadas junto com os textos. Um atributo SRC deve estar presente, da seguinte forma: <img src="url_imagem"> Onde URL_imagem é o URL do arquivo que contém a imagem que se quer inserir; pode ser referenciada uma imagem que esteja em um outro servidor (o que, logicamente, não é conveniente). Assim, escrevendo: <img src = "nome_da_figura.extensão"> ou, se ela estiver dentro de uma pasta no mesmo servidor: <img src = "nome_da_pasta/nome_da_figura.extensão"> Por exemplo, se deseja-se inserir na página uma imagem chamada arvore.gif localizada no mesmo servidor e na mesma pasta, a tag seria assim: <img src = "arvore.gif"> As imagens usadas na Web, normalmente são armazenadas em arquivos com as seguintes extensões:.gif,.jpg,.png,.bmp Atributos Básicos de Imagem ALT: indica um texto alternativo, descrevendo brevemente a imagem, que é apresentado no lugar da imagem nos browsers. Ou quando se desabilita o carregamento de imagens em browsers gráficos. É recomendável que esteja sempre presente. TITLE: é o que aparecerá ao passar o mouse sobre a imagem. <img src="endereço da imagem" alt="texto alternativo" title= aparece ao passar o mouse > Dessa forma: <img src="newred.gif" alt="novo!!!" title= Novo Vermelho!!! > É apresentado nos browsers gráficos assim: e, nos browsers texto, assim: [Novo!!!]. E ao passar o mouse sobre a figura aparecerá a descrição Novo Vermelho!!! Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
24 WIDTH e HEIGHT Atributos de dimensão da imagem, em pixels 4. Grande parte dos Editores HTML coloca automaticamente os valores destes atributos, quando indica-se a inserção de uma imagem. <img src="endereço" alt="descrição" width="largura" height="altura"> Uma das vantagens de usar esses atributos é que o browser pode montar mais rapidamente as páginas, por saber de antemão o espaço que deverá ser reservado a elas. BORDER Quando uma frase é marcada como âncora de um link, ela se apresenta sublinhada. Quando uma imagem faz as vezes de âncora, ganha uma borda que indica sua condição de link. Porém, por questões de apresentação, nem sempre interessa ter essa borda ao redor da imagem. Assim, com o atributo BORDER, é possível controlar esse detalhe. * Se quiser uma borda mais larga: <a href="url"> <img src="imagem" alt="descrição" border=4> </a> * Se quiser uma imagem sem borda: <a href="url"> <img src="imagem" alt="descrição" border=0> </a> Essa borda pode ser apresentada também em imagens que não são âncora de links. Basta aplicar, por exemplo, a formatação: <img src="figura1.gif" alt="minha foto" border=2> Assim, é possível dar mais destaque a uma imagem, sem ser necessário editá-la: Foto Original Foto com Borda gerada pelo HTML 4 Pixel: O pixel, ou ponto, é a menor unidade que compõe uma imagem digital, ele contém os atributos de cor de cada ponto, a maior ou menor quantidade de pixels em uma área é que determinam a resolução da imagem, bem como seu maior ou menor tamanho em bytes. São pontos por centímetro quadrado. Quanto maior o número de pixels maior a qualidade da imagem e maior será o tamanho do arquivo também. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
25 ALIGN <img src="imagem.extensão" alt="descrição" align=alinhamento> Existem também atributos de alinhamento, que produzem os seguintes resultados: ALIGN=TOP: Alinha o texto adjacente com o topo da imagem, embora com linhas compridas o resultado não seja muito bom. ALIGN=MIDDLE: Alinha o texto adjacente com o meio da imagem, embora com linhas compridas o resultado não seja muito bom. ALIGN=BOTTOM: Alinha o texto adjacente com a parte de baixo da imagem (default). ALIGN=RIGHT: Alinha imagem à direita, e tudo o que houver ao redor (texto, outras imagens) a partir do topo da imagem. ALIGN=LEFT: Alinha imagem à esquerda, e tudo o que houver ao redor (texto, outras imagens) a partir do topo da imagem. Para ter duas imagens, uma em cada margem, numa mesma linha, escreva: <img align=left src="nome_imagem" alt="descrição"> <img align=right src="nome_imagem" alt="descrição">...e pode-se escrever à vontade entre as imagens! Isto resulta em:...e pode-se escrever à vontade entre as imagens! Um detalhe surgido com o alinhamento de imagens foi a necessidade de se liberar o texto desse alinhamento, ou seja: suponha um texto mais ou menos curto, que deseja-se colocar com a imagem ilustrativa, mas gostaria que este trecho já estivesse abaixo da imagem! De acordo com o comprimento da primeira frase, não seria possível usar o alinhamento TOP. Para conseguir isso, seria necessário incluir diversos <BR> consecutivos, inserindo linhas em branco; mesmo assim, o resultado final poderia ser bem pouco elegante. Surgiu, então, o atributo CLEAR para <BR>. Com esse atributo, é possível, por exemplo ter um texto posicionado no ponto em que a margem direita fica livre, com <BR CLEAR=RIGHT> ou no ponto em que a margem esquerda fica livre, com <BR CLEAR=LEFT>. Dessa maneira, pode-se controlar bem a posição relativa dos textos. Também pode-se posicionar o texto no ponto em que ambas as margens estão livres. Isso é conseguido com <BR CLEAR=ALL>. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
26 17 Molduras de Imagem Para melhorar ainda mais a apresentação das imagens junto com os textos, foram desenvolvidos atributos de moldura. Estes atributos definem o espaço - vertical e horizontal - deixado entre as imagens e os textos circundantes: <img src="imagem.extensão" vspace = espaço_vertical> <img src="imagem.extensão" hspace = espaço_horizontal> Outros exemplos: <img src="foto.gif" width="148" height="95" align=left vspace="30"> <img src="foto.gif" width="160" height="71" align=right hspace="30"> Abaixo, um exemplo com os dois atributos, através da formatação: <img src="foto.gif" align="left" width="63" height="68" hspace="20" vspace="20"> Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
27 18 Tabelas A formatação de tabelas foi adotada bem antes de sua inclusão na definição de HTML. A manipulação de tabelas, mesmo em editores, é trabalhosa. A maior diferença entre tabelas em HTML e em editores como o MS-Word, entretanto, é o fato das tabelas em HTML serem definidas apenas em termos de linhas e não de colunas. Mas isso será percebido no decorrer deste capítulo. As tabelas por muito tempo foram utilizadas para fazer os layouts das páginas web. Hoje em dia não se deve usar tabelas para layout, ou seja, usa-se tabelas em HTML apenas se for necessário ter uma tabela na página. Pesquise sobre o conceito de tableless Elementos básicos de tabelas <TABLE>...</TABLE> delimita uma tabela. Um atributo básico é BORDER, que indica a apresentação da borda. <table border="borda">... </table> 18.2 Títulos, linhas e elementos <CAPTION>...</CAPTION> define o título da tabela <TR>...</TR> delimita uma linha <TH>...</TH> define um cabeçalho para colunas ou linhas (dentro de <TR>) <TD>...</TD> delimita um elemento ou célula (dentro de <TR>) Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
28 18.3 Uma tabela simples <table border=4> <caption>primeiro Exemplo</caption> <tr><th>coluna 1</th> <th>coluna 2</th></tr> <tr><td>linha 1, Coluna 1</td> <td>linha 1, Coluna 2</td></tr> <tr><td>linha 2, Coluna 1</td> <td>linha 2, Coluna 2</td></tr> </table> Primeiro Exemplo Coluna 1 Coluna 2 Linha 1, Coluna 1 Linha 1, Coluna 2 Linha 2, Coluna 1 Linha 2, Coluna Títulos compreendendo mais de uma coluna ou linha É possível englobar colunas e linhas, através dos atributos COLSPAN (para colunas) e ROWSPAN (para linhas): <table border=1> <tr><th colspan=2>colunas 1 e 2</th></tr> <tr><td>linha1, coluna 1</td><td> linha 1, coluna 2</td></tr> <tr><td>linha 2, coluna 1</td><td>linha 2, coluna 2</td></tr> <tr><th rowspan=3>3 linhas</th><td>uma linha</td></tr> <tr><td>duas linhas</td></tr> <tr><td>tres linhas</td></tr> </table> Colunas 1 e 2 linha1, coluna 1 linha 1, coluna 2 linha 2, coluna 1 linha 2, coluna 2 3 linhas uma linha duas linhas tres linhas Neste exemplo, vemos que o cabeçalho Colunas 1 e 2 compreende duas colunas (COLSPAN=2); o cabeçalho 3 linhas compreende, por sua vez, 3 linhas (ROWSPAN=3). Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
29 18.5 Tabelas sem borda As páginas deste tutorial foram construídas com tabelas sem borda. Para tanto, foi empregada a seguinte declaração: <table border="0">... </table> Dica: Pior que os acentos... A formatação de tabelas é complicada, e o texto fonte chega a ser quase ininteligível quando montamos tabelas complexas e fazemos uso de seus diversos atributos. A melhor opção, sem dúvida, é usar os editores WYSIWYG. Alguns editores de modo texto têm uma interface gráfica que ajuda na criação de tabelas, mas a edição de tabelas já existentes precisa ser feita à mão Extensões de Tabelas Diversas extensões de tabelas possibilitam a apresentação de efeitos muito bons nas páginas. Cor de fundo <table border=5 cellspacing=5 cellpadding=10> <tr> <td bgcolor="#e1ffd9">janeiro</td> <td>fevereiro</td> <td bgcolor="#e1ffd9">março</td> </tr> <tr> <td>abril</td> <td bgcolor="#e1ffd9">maio</td> <td>junho</td> </tr> </table> janeiro fevereiro março Abril maio junho Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
30 Cor de borda <table border=5 cellspacing=5 cellpadding=10 bgcolor="#e1ffd9" bordercolor="#00ff00"> janeiro fevereiro março abril maio junho Exemplo colocando cor de fundo e na borda: <table border="1" cellspacing="0" cellpadding=10 bordercolor="#00ff00"> <tr> <td bgcolor="#e1ffd9">janeiro</td> <td>fevereiro</td> <td bgcolor="#e1ffd9">março</td> </tr> <tr> <td>abril</td> <td bgcolor="#e1ffd9">maio</td> <td>junho</td> </tr> </table> janeiro fevereiro março abril maio junho Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
31 19 Formulários HTML Os formulários HTML são estruturas que permitem que usuários submetam dados a uma página. Esses dados podem ser tratados e/ou armazenados dependendo da aplicação Criando um Form Os forms fazem parte do código HTML, portanto devem ser definidos como as tags desta linguagem. Sempre com uma tag de abertura e outra de fechamento, inserindo o conteúdo entre estas duas. Exemplo: 19.2 Parâmetros do Form Action: é o script ou página para onde os dados serão submetidos. Neste script que normalmente os dados são tratados. Method: é o método de envio dos dados. Pode ter dois valores: GET: passa os valores pela URL, ou seja, podemos ver as variáveis passadas na Url da página destino definida no campo action. Não é muito aconselhável o uso do método GET, pois ele expõe o nome e valor das variáveis, o que pode ser utilizado por pessoas com intenções maléficas. POST: passa as variáveis de maneira transparente para o usuário. É o método mais aconselhável. Veja mais diferenças entre Get e Post em: Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
32 19.3 Elementos do Form Pode-se inserir vários tipos de entrada de dados em um formulário, a maioria delas definida pela tag input. Todo elemento possui um parâmetro name que é utilizado para identificar a variável onde o dado está contido no script destino. Lembrando que estes elementos devem ser inseridos entre as tags <form> e </form>. CAMPO TEXTO: campo para entrada de texto comum. Declaração: Parâmetros: Size: tamanho do elemento em caracteres na página HTML (que será exibido na tela). Maxlength: tamanho máximo do texto que pode ser inserido no elemento. Value: utilizado quando há necessidade de se pré-definir um valor para o elemento. Este valor pode ser normalmente alterado pelo usuário. CAMPO SENHA: tipo de campo idêntico ao anterior, mas quando o usuário digita, os caracteres são substituídos por *. Atenção: o campo senha não possui nenhum tipo de criptografia, apenas coloca uma máscara no texto inserido. Declaração: Parâmetros: Size: tamanho do elemento em caracteres na página HTML (que será exibido na tela). Maxlength: tamanho máximo do texto que pode ser inserido no elemento. Value: utilizado quando há necessidade de se pré-definir um valor para o elemento. Este valor pode ser normalmente alterado pelo usuário. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
33 BOTÃO RÁDIO (RADIO BUTTON): utilizado para entradas de múltipla escolha onde o usuário só pode escolher uma única opção. Para que o interpretador saiba que as opções fazem parte do mesmo grupo, e permita que só uma seja selecionada, basta colocar o mesmo nome no parâmetro name dos botões rádio. Declaração: Parâmetros: Checked: se for declarado, o elemento terá seu estado inicial como selecionado. Value: valor que será passado à página destino quando o formulário é submetido, se este elemento estiver selecionado. BOTÃO DE CHECAGEM (CHECK BOX): utilizado para entradas de múltipla escolha onde o usuário pode escolher várias opções. Cada opção deve ter um nome independente. Declaração: Parâmetros: Checked: se for declarado, o elemento terá seu estado inicial como marcado. Value: valor que será passado à página destino quando o formulário é submetido se este elemento estiver marcado. BOTÃO SUBMETER (SUBMIT): botão que submete o formulário à pagina destino especificada no parâmetro action do form. Declaração: Parâmetros: Value: texto que aparecerá no botão. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
34 BOTÃO RESET: volta todos os campos do formulário para os valores iniciais, ou seja, os valores especificados nos parâmetros value de cada um dos campos. Declaração: Parâmetros: Value: texto que aparecerá no botão. SELECT: utilizado para selecionar uma ou mais opções de uma lista predefinida. Declaração: Parâmetros: Multiple: se existir, permite que sejam selecionadas múltiplas opções através das teclas Ctrl ou Shift. Size: número de opções exibidas por vez na tela. Se o size estiver setado para 1 que é o default e não existir o parâmetro multiple, o elemento é exibido como um Combo Box. Caso contrário, é exibido como um Select List. Option: cada subtag option adiciona uma opção ao elemento. Value: o value de cada option é o valor passado caso aquela opção seja selecionada. Observação: O texto da opção deve ser especificado entre as tags <option> e </option> ÁREA DE TEXTO: permite a entrada de um texto com várias linhas. Declaração: Parâmetros: Cols: número e caracteres por linha. Rows: número de linhas do campo. Observação: não existe o parâmetro value, o texto inicial deve ser definido entre as tags <textarea> e </textarea>. Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
35 19.4 Trabalhando com os dados enviados pelo Form Como visto anteriormente, os forms submetem os dados à um script ou página especificada no parâmetro action. Este script ou página pode ser ou não o mesmo onde o form está contido. No script destino, são criadas automaticamente variáveis com os mesmos nomes dos elementos do form, contendo o valor submetido. Por exemplo: Em uma página qualquer tem-se o seguinte código: Que resulta no seguinte formulário: Quando este form for submetido (clicando no botão Enviar), na página teste.php será criada uma variável com o nome $nome contendo o texto que foi digitado no campo Colocando em Prática Vamos criar duas páginas (dois arquivos) no nosso servidor de teste: tutorial.php: será o formulário com algumas perguntas. resultado.php: onde serão exibidas as respostas de uma maneira amigável. No primeiro arquivo, tutorial.php, você deve criar uma estrutura HTML normal, e dentro do body criar um formulário que submete os dados lidos no formulário para a página resultado.php, onde essas informações serão trabalhadas, da seguinte maneira: Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
36 Criar um campo texto para entrada do nome, um checkbox perguntando se o usuário leu o tutorial e um campo select para entrada da nota dada ao tutorial. Salvar o arquivo com o nome tutorial.php, conforme código abaixo: A página deve ficar da seguinte maneira (ao abrir no browser): Agora você deve criar o arquivo resultado.php, que receberá os dados enviados pelo formulário quando o usuário clicar no botão Enviar. Da seguinte maneira: Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
37 Para testar o formulário é necessário ter instalado o Wamp e ter salvo os dois arquivos (tutorial.php e resultado.php) dentro da pasta www do Wamp. Também verifique se os serviços do Wamp estão online (o ícone deve estar verde). Você deve abrir o arquivo tutorial.php em um navegador da seguinte forma: localhost/tutorial.php, pois só assim os comandos PHP irão funcionar. No Mozilla Firefox, aparecerá da seguinte maneira: Conclusão: este tutorial mostrou como utilizar forms HTML, explicando detalhadamente seus elementos e respectivos parâmetros e como capturar e utilizar os dados enviados pelos mesmos usando a linguagem PHP e o pacote Wamp. Material completo com exemplos e detalhes sobre HTML que serviu como uma das fontes para elaboração desta apostila: Autora: Maria Alice Soares de Castro Também foi usado como fonte: Profa. Flávia Pereira de Carvalho - fpereira@faccat.br
A estrutura de um documento HTML apresenta os seguintes componentes:
A estrutura de um documento HTML apresenta os seguintes componentes: Titulo do Documento texto, imagem, links,... As etiquetas HTML não são sensíveis
Profa. Reane Franco Goulart
Profa. Reane Franco Goulart A linguagem HTML (Hypertext Markup Language) tem o objetivo de formatar textos através de marcações especiais denominadas tags, para que possam ser exibidos de forma conveniente
Quem sou eu? Ana Paula Alves de Lima. Formação: E-mail: paulapeniel@gmail.com
Introdução a Linguagem HTML: Conceitos Básicos e Estrutura ANA PAULAALVES DE LIMA INFORMÁTICA E METODOLOGIA - SUBSEQUENTE 1 Quem sou eu? Ana Paula Alves de Lima Formação: Bacharel em Sistemas de Informação;
Introdução. Introdução a HTML. A Linguagem HTML. Estrutura de uma Página. Mário Antonio Meireles Teixeira
Introdução Introdução a HTML Mário Antonio Meireles Teixeira Dept o. de Informática - UFMA mario@deinf.ufma.br Página Web: É um documento composto de texto e códigos especiais, chamados tags, que especificam
CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1
ESCOLA ESTADUAL PROF. JOSÉ BARROSO TOSTES PROFESSOR: ESP. ANDREW RODRIGUES CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1 CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1 1 APOSTILA DE INTRODUÇÃO À LINGUAGEM
TECNOLOGIAS WEB. Unidade 2 Introdução a Construção de Páginas Estáticas. Luiz Leão luizleao@gmail.com http://luizleao.com
Luiz Leão luizleao@gmail.com http://luizleao.com CONTEÚDO PROGRAMÁTICO DESTA UNIDADE HTML TAG S HTML LINGUAGEM HTML Hypertext Markup Language Interpretada pelo navegador Não linearidade da informação Formatação
Vejamos um exemplo. Vamos supor que queiramos montar uma tabela 3X2, ou seja de 3 colunas por 2 linhas, o código HTML para isso é :
TABELAS As tabelas são muito importantes para o designer de uma home-page. Com elas podese fazer alinhamentos que dificilmente seriam possíveis com simples comandos. A funcionalidade de uma tabela faz
Aula 2: Listas e Links
Aula 2: Listas e Links Nesta segunda aula, você aprenderá a utilizar listas numeradas ou não, a entender o que são listas de definições e como fazer referências a outros documentos. Vamos entender a diferença
INTRODUÇÃO AO DESENVOLVIMENTO WEB. PROFª. M.Sc. JULIANA H Q BENACCHIO
INTRODUÇÃO AO DESENVOLVIMENTO WEB PROFª. M.Sc. JULIANA H Q BENACCHIO Estrutura básica do HTML Um documento HTML deve estar delimitado pela tag e . Dentro deste documento, podemos ainda distinguir
André Kawamoto NE31A
André Kawamoto NE31A Internet Internet: uma coleção de redes Todos os computadores conectados à Internet fazem parte de uma rede (rede local, rede doméstica) Rede de Redes Internet x WWW Internet e World
PÓS-GRADUAÇÃO EM MATEMÁTICA COMPUTACIONAL INFORMÁTICA INSTRUMENTAL Aula 06: Introdução Linguagem HTML
PÓS-GRADUAÇÃO EM MATEMÁTICA COMPUTACIONAL INFORMÁTICA INSTRUMENTAL Aula 06: Introdução Linguagem HTML O Desenvolvimento Web O desenvolvimento web é o termo utilizado para descrever atividade relacionada
Web Design Aula 11: XHTML
Web Design Aula 11: XHTML Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação HTML 1.0-2.0: Havia hipertextos, não havia preocupação com a apresentação HTML 3: Guerra dos Browser (Microsoft
Autoria Web HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza
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 Apresentar
WEB DESIGNER WEB DESIGNER
WEB DESIGNER 1 WEB DESIGNER INICIO DO CURSO DE HTML 4.0 Toda vez que você acessar um site (veja tópico Word Wide Web) por meios de domínios quando adiciona a URL na barra de endereço, do seu Navegador
Aplicação para Web I. Começando a compreender o HTML
Aplicação para Web I Começando a compreender o HTML A Linguagem da WEB O HTML ou HyperText Markup Language linguagem universal compreendida pelos navegadores web (browsers) para a comunicação utilizando
Prof.: Melba Lima Gorza Aula Introdutória de HTML. Componentes do HTML. Estrutura de um documento XHTML
Prof.: Melba Lima Gorza Aula Introdutória de HTML Componentes do HTML Estrutura de um documento XHTML primeiro Documento XHTML meu primeiro documento XHTML
Programação de Servidores CST Redes de Computadores
Programação de Servidores CST Redes de Computadores Marx Gomes Van der Linden http://marx.vanderlinden.com.br ( Material baseado no original de Marcelo José Siqueira Coutinho de Almeida ) HMTL Arquivo-texto
Unidade IV Introdução à Linguagem PHP Parte 1
Unidade IV Introdução à Linguagem PHP Parte 1 Professor Fabiano de Paula Soldati fpsoldati@yahoo.com.br http://br.groups.yahoo.com/group/professorsoldati/ Introdução HTML = HyperText Markup Language HTML
Desenvolvimento em Ambiente Web. HTML - Introdução
Desenvolvimento em Ambiente Web HTML - Introdução O que é HTML? HTML é uma linguagem para descrever a estrutura de uma página WEB. Ela permite: Publicar documentos online com cabeçalhos, texto, tabelas,
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
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
ftp://ftp.cr-df.rnp.br/pub/netinfo/training/rnp/kit-bsb/html/guia5.zip 1996 Tutorial - Autoria em World Wide Web
RNP REDE NACIONAL DE PESQUISA Centro Regional de Brasília CR/DF ftp://ftp.cr-df.rnp.br/pub/netinfo/training/rnp/kit-bsb/html/guia5.zip janeiro 1996 Tutorial - Autoria em World Wide Web Parte IV - Hypertext
HTML Página 1. Índice
PARTE - 1 HTML Página 1 Índice HTML A HISTÓRIA... 2 O COMEÇO E A INTEROPERABILIADE... 3 Primeira Página... 4 Entendendo seu código... 5 Abrindo o código fonte da sua página... 6 Comentários na página...
Links e Frames José Antônio da Cunha
Links e Frames José Antônio da Cunha Links Até agora, produzimos documentos simples. Mas os documentos de hipertexto têm como principal característica, fazer ligações com outros hipertextos. Os pontos
Introdução ao HTML Utilizando frames Hospedando seu site na WEB
Introdução ao HTML Utilizando frames Hospedando seu site na WEB Por quê???? Por que com tantos editores gráficos de HTML, devemos saber como escrever um código fonte? Porque se você só viu páginas feitas
LINGUAGEM DE PROGRAMAÇÃO HTML COMPONENTES: ROBSON EDMILSON
COMPONENTES: ROBSON EDMILSON O HTML (Hiper Text Mark-up Language) é uma linguagem de programação hipertexto. O HTML tem códigos para criar páginas na web. Estes códigos que definem o tipo de letra, qual
Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza
Webdesign Introdução a 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 Apresentar as
Web Design. Prof. Felippe
Web Design Prof. Felippe 2015 Sobre a disciplina Fornecer ao aluno subsídios para o projeto e desenvolvimento de interfaces de sistemas Web eficientes, amigáveis e intuitivas. Conceitos fundamentais sobre
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
Linguagem de. Aula 06. Profa Cristiane Koehler cristiane.koehler@canoas.ifrs.edu.br
Linguagem de Programação IV -PHP Aula 06 Profa Cristiane Koehler cristiane.koehler@canoas.ifrs.edu.br Criação de Formulários o Um formulário consiste em uma série de campos que são preenchidos pelo usuário
Portal do Projeto Tempo de Ser
Sumário Portal do Projeto Tempo de Ser O que é um Wiki?...2 Documentos...2 Localizando documentos...3 Links...3 Criando um Documento...4 Criando um link...4 Editando um Documento...5 Sintaxe Básica...5
MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS. Redes de Comunicação
MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS Redes de Comunicação Regras para um website eficaz Categorização dos conteúdos estrutura lógica dos conteúdos Condensação conteúdos simples e directos
DESENVOLVIMENTO WEB I - 7122
6.2 - Formulários: Um dos recursos mais fascinantes da linguagem HTML é a possibilidade de criar formulários eletrônicos. Usando um formulário o usuário pode interagir com o servidor, enviando dados que
QUEM FEZ O TRABALHO?
Introdução a Linguagem HTML: Conceitos Básicos e Estrutura ANA PAULAALVES DE LIMA 1 QUEM FEZ O TRABALHO? Com as tagsaprendidas hoje, faça uma página HTML sobre você com as seguintes informações: Seu nome
6.2 - Formulários: form <form action="url_de_script" method="método">...</form> form action method POST GET exceto outros formulários form
6.2 - Formulários: Um dos recursos mais fascinantes da linguagem HTML é a possibilidade de criar formulários eletrônicos. Usando um formulário o usuário pode interagir com o servidor, enviando dados que
Scientific Electronic Library Online
FAPESP - CNPq BIREME - FapUNIFESP Scientific Electronic Library Online Manual de Codificação de Tabelas para xhtml Projeto PMC São Paulo Novembro 2013 INTRODUÇÃO Este manual tem o objetivo de mostrar passo
CADERNOS DE INFORMÁTICA Nº 1. Fundamentos de Informática I - Word 2010. Sumário
CADERNO DE INFORMÁTICA FACITA Faculdade de Itápolis Aplicativos Editores de Texto WORD 2007/2010 Sumário Editor de texto... 3 Iniciando Microsoft Word... 4 Fichários:... 4 Atalhos... 5 Área de Trabalho:
mkdir /srv/www/default/html/calculadora/imagens mkdir /srv/www/default/html/calculadora/blocos
Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Criando uma Calculadora Primeiramente deve se criar uma estrutura para armazenar os arquivos necessários para o funcionamento da calculadora.
HTML Página 29. Índice
PARTE - 5 HTML Página 29 Índice HTML - Hiperlinks... 30 Frames com links... 31 O código fonte do arquivo índex.htm... 31 Conhecendo os comandos border e bordercolor do frame... 31 Conhecendo os comandos
INTRODUÇÃO AO DESENVOLVIMENTO WEB
INTRODUÇÃO AO DESENVOLVIMENTO WEB PROFª. M.Sc. JULIANA H Q BENACCHIO Formulários Os formulários em HTML são usados para selecionar diferentes tipos de entradas do usuário. Um formulário é uma área que
CRIAÇÃO DE SITES (AULA 3)
Prof. Breno Leonardo Gomes de Menezes Araújo brenod123@gmail.com http://blog.brenoleonardo.com.br CRIAÇÃO DE SITES (AULA 3) Mais algumas tags Existem tagsque são abertas e fechadas em única tag. Estas
Introdução à Linguagem HTML
Introdução à Linguagem HTML HTML (HyperText Markup Language - Linguagem de Formatação de Hipertexto) é fruto do "casamento" dos padrões HyTime e SGML.; HyTime - Hypermedia/Time-based Document Structuring
Programação WEB II. Formulários Em PHP. Métodos GET e POST progweb2@thiagomiranda.net. Thiago Miranda dos Santos Souza
Formulários Em PHP Métodos GET e POST progweb2@thiagomiranda.net Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Entender o funcionamento
Manual de Publicação Wordpress
Fundação Universidade Federal de Mato Grosso do Sul Manual de Publicação Wordpress Núcleo de Tecnologia da Informação - UFMS Maurílio Mussi Montanha 2014 Sumário 1 Introdução... 3 2 ACESSO À INTERFACE
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
Universidade Federal do Espírito Santo
Universidade Federal do Espírito Santo Núcleo de Tecnologia da Informação Gerenciamento do Conteúdo de Sítios Institucionais Versão 1.4 Atualizado em: 8/10/2015 Sumário Sumário................................................
Para o PowerPoint, assim como para vários softwares de apresentação, uma apresentação é um conjunto de slides.
POWERPOINT 1. O QUE É UMA APRESENTAÇÃO Para o PowerPoint, assim como para vários softwares de apresentação, uma apresentação é um conjunto de slides. Em cada slide podemos ter vários elementos ou objetos
Criando um projeto ASP.Net no Visual Studio 2008
Criando um projeto ASP.Net no Visual Studio 2008 Ao abrir o Visual Studio 2008, vá no menu File > New > Project (como mostra a imagem abaixo) ou simplesmente pressionando as teclas Ctrl + Shift + N. Nas
Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2
Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Objetivo. O objetivo da disciplina é conhecer os princípios da programação de
Definindo um Layout de Website sem Tabelas Vou apresentar nesse post como fazer o código do layout de um website sem utilizar
Definindo um Layout de Website sem Tabelas Vou apresentar nesse post como fazer o código do layout de um website sem utilizar tabelas (tableless), e utilizando muito . Para continuar lendo esse post,
Para o OpenOffice Impress, assim como para vários softwares de apresentação, uma apresentação é um conjunto de slides.
OPENOFFICE IMPRESS 1. O QUE É UMA APRESENTAÇÃO Para o OpenOffice Impress, assim como para vários softwares de apresentação, uma apresentação é um conjunto de slides. Em cada slide podemos ter vários elementos
Manual de Utilizador. Caderno. Recursos da Unidade Curricular. Gabinete de Ensino à Distância do IPP. http://eweb.ipportalegre.pt. ged@ipportalegre.
Manual de Utilizador Caderno Recursos da Unidade Curricular Gabinete de Ensino à Distância do IPP http://eweb.ipportalegre.pt ged@ipportalegre.pt Índice RECURSOS... 1 ADICIONAR E CONFIGURAR RECURSOS...
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):
Relatório: Página HTML
Universidade do Minho Escola de Engenharia Relatório: Disciplina: Linguagens de Programação Curso: Engenharia e Gestão Industrial Carolina Fernandes N.º40532 Guilherme Bacinello N.º42119 Diana Rocha N.º40536
Questões de Informática Prova Comentada Ministério Público da União
NOÇÕES DE INFORMÁTICA QUESTÕES COMENTADAS Prof.: Erion Monteiro Questões de Informática Prova Comentada Ministério Público da União Nível Superior Cargo 1 Analista Administrativo 11/9/2010 Sequencial 015
Roteiro 2: Conceitos de Tags HTML
Roteiro 2: Conceitos de Tags HTML Objetivos Detalhar conceitos sobre TAGS HTML: elementos, atributos, elemento vazio, links. Implementar páginas de internet com uso da linguagem HTML; Ferramentas Necessárias
HTML Básico. Antonio Fernando de Oliveira Núcleo de Computação Eletrônica da UFRJ Tel. (021) 2598-3111 e-mail: antonio@nce.ufrj.br
HTML Básico Antonio Fernando de Oliveira Núcleo de Computação Eletrônica da UFRJ Tel. (021) 2598-3111 e-mail: antonio@nce.ufrj.br Referências Bibliográficas: Iniciando em HTML Ramalho, Makron Books Home
CONCEITOS INICIAIS. Agenda A diferença entre páginas Web, Home Page e apresentação Web;
CONCEITOS INICIAIS Agenda A diferença entre páginas Web, Home Page e apresentação Web; O que é necessário para se criar páginas para a Web; Navegadores; O que é site, Host, Provedor e Servidor Web; Protocolos.
<!DOCTYPE html> <html lang = "pt-br"> <head> <meta charset = UTF-8"> <title> Exemplo de uso correto da semântica HTML </title> </ head >
Para um navegador exibir corretamente uma página web, devemos informar explicitamente o tipo do documento. O tipo do documento é informado com a declaração . TAG
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
1) Ao ser executado o código abaixo, em PHP, qual será o resultado impresso em tela?
Exercícios sobre Linguagem PHP: 1) Ao ser executado o código abaixo, em PHP, qual será o resultado impresso em tela? 2) Considere a linguagem de programação PHP e seus operadores. A execução da sentença:
UTILIZANDO RECURSOS E ATIVIDADES NO MOODLE
UTILIZANDO RECURSOS E ATIVIDADES NO MOODLE Luanna Azevedo Cruz Polyana Ribas Bernardes 2015 2015 1. INTRODUÇÃO Para utilizar as funcionalidades acesse o Moodle: http://moodle.ead.ufvjm.edu.br/ e clique
Verifique se o Plugin do Flash Player está instalado no seu computador para a navegação adequada no portal.
1 Tutorial: Blogs no Clickideia Introdução Esse tutorial mostrará as funções básicas da ferramenta de Blog do Portal Educacional Clickideia. Ele foi elaborado pensando em diferentes níveis de usuários
Treinamento em BrOffice.org Writer
Treinamento em BrOffice.org Writer 1 Índice I. INTRODUÇÃO...3 II. BARRA DE FERRAMENTAS...3 III. CONFIGURAR PÁGINA...4 1. Tamanho, Margens e Orientação...5 2. Cabeçalhos...6 3. Rodapés...6 4. Numerando
Amostra OpenOffice.org 2.0 Writer SUMÁRIO
Amostra OpenOffice.org 2.0 Writer SUMÁRIO 1. INTRODUÇÃO 2. INSERIR TEXTO 3. SALVAR UM DOCUMENTO 4. FECHAR UM DOCUMENTO 5. INICIAR UM NOVO DOCUMENTO 6. ABRIR UM DOCUMENTO 7. SELECIONAR TEXTO 8. RECORTAR,
Introdução. HyperText Markup Language HTML. Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário
Introdução 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/ O usuário interage com os serviços
Prova de pré-requisito
Prova de pré-requisito PHP & MySQL: Técnicas para Web 2.0 1 - Qual das opções constrói a tabela abaixo: DIA MÊS ANO 28 04 1988 22 02 2002 a) b) c) dia mês ano
( Curso Introdutório) Versão 0.2a 7 de março de 2005 - Versão - Rascunho -
Apostila de XHTML ( Curso Introdutório) Versão 0.2a 7 de março de 2005 - Versão - Rascunho - Prof. Luis Rodrigo de O. Gonçalves E-mail:luisrodrigoog@yahoo.com.br site: http://www.lrodrigo.cjb.net Prof.
Aula de JavaScript 05/03/10
Objetos Sabe-se que variável são contêiners que podem armazenar um número, uma string de texto ou outro valor. O JavaScript também suporta objetos. Objetos são contêiners que podem armazenar dados e inclusive
> Herbet Ferreira Rodrigues > contato@herbetferreira.com
Curso HTML & CSS > Herbet Ferreira Rodrigues > contato@herbetferreira.com Sumário > Apresentação > Introdução ao HTML História Começando a Programar > Tags em HTML Headings (Cabeçalhos) Parágrafos Formatação
HTML. Sessão 8 HTML. Criação de Páginas WEB. Formulários
HTML Sessão 8 HTML Falta ver de que forma podemos trocar informações com nosso visitante. Este aspecto é primordial para a grande quantidade de acções que se podem realizar : Comprar um artigo, preencher
Índice. 1.1. Static Text (texto estático)...1 1.2. Dynamic Text (Texto Dinâmico)...3 1.3. Input Text...7 1.4. Exercício...8
Textos no Flash Índice 1. Texto no Flash...1 1.1. Static Text (texto estático)...1 1.2. Dynamic Text (Texto Dinâmico)...3 1.3. Input Text...7 1.4. Exercício...8 1. Texto no Flash Há três maneiras de se
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
Prof Rafael Guem Murakami
Prof Rafael Guem Murakami São Paulo 2006 Sumário: Definição:... 4 Barra de Formatação:... 4 Configuração de página:... 5 Bordas e Sombreamento:... 6 Índices:... 8 Inserindo Figuras:... 12 Word-Art:...
Mais sobre uso de formulários Site sem Ajax
Mais sobre uso de formulários Site sem Ajax Página com busca padrão 1 Página com o resultado da busca carregada no local da anterior (o formulário está vazio) Site com Ajax 2 Site usando Ajax para preencher
SAMUEL INFORMÁTICA SEAP 11-02-2015. Curso Básico de MS Office Word 2010/BrOffice Writer
SEAP 11-02-2015 SAMUEL INFORMÁTICA Curso Básico de MS Office Word 2010/BrOffice Writer O MS-Word 2010 é um grande processador de texto onde realiza grande parte de serviços de escritórios, cartas, currículos
Migrando para o Word 2010
Neste guia O Microsoft Word 2010 está com visual bem diferente, por isso, criamos este guia para ajudar você a minimizar a curva de aprendizado. Leia-o para saber as partes principais da nova interface,
1. INTRODUÇÃO. 1.1 Como são as marcações (tags) HTML?
HTML 1. INTRODUÇÃO HTML abreviação de HiperText Markup Language é a linguagem de programação que usamos para criar uma página Web, que, por sua vez, será composta de textos e comandos especiais, chamados
UNIVERSIDADE FEDERAL DO AMAPÁ PRÓ REITORIA DE ADMINISTRAÇÃO E PLANEJAMENTO DEPARTAMENTO DE INFORMÁTICA. Manual do Moodle- Sala virtual
UNIVERSIDADE FEDERAL DO AMAPÁ PRÓ REITORIA DE ADMINISTRAÇÃO E PLANEJAMENTO DEPARTAMENTO DE INFORMÁTICA Manual do Moodle- Sala virtual UNIFAP MACAPÁ-AP 2012 S U M Á R I O 1 Tela de Login...3 2 Tela Meus
Layouts de páginas com HTML e CSS
Layouts de páginas com HTML e CSS Layouts de Páginas com CSS.... 2 Layout com tamanho Líquido... 2 Layout com tamanho Fixo... 3 Desenvolvendo um layout com tamanho fixo.... 5 Layouts de Páginas com CSS.
Do Word 2007 para o Office 365 para empresas
Do Word 2007 para o Office 365 para empresas Faça a migração O Microsoft Word 2013 para área de trabalho está diferente das versões anteriores. Assim, veja a seguir uma visão geral dos novos recursos e
4.14 - Imagens: <img src="..."> src <img src="tecnologia.jpg"> único atributo que não pode ser omitido neste TAG Nota: img
4.14 - Imagens: O TAG utilizado para a inclusão de imagens em páginas html é o: O atributo src especifica o local onde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso
UNIPAMPA Universidade Federal do Pampa. Núcleo de Tecnologia da Informação (NTI)
UNIPAMPA Universidade Federal do Pampa Núcleo de Tecnologia da Informação (NTI) Instruções para gerenciamento dos sites em Joomla (versão 1.5.3) Níveis: Editor e Administrador Junho/2008 Í N D I C E Usuários
Introdução à Tecnologia Web
Introdução à Tecnologia Web HTML HyperText Markup Language XTML extensible HyperText Markup Language Elementos da Seção do Corpo Tabelas Formulários Professor Alan Cleber Borim www.alanborim.com.br Índice.
O QUE É A CENTRAL DE JOGOS?
O QUE É A CENTRAL? A Central de Jogos consiste de duas partes: Um site na Internet e um programa de computador (Central) que deve ser instalado em sua máquina. No site www.centraldejogos.com.br, você pode
PREFEITURA MUNICIPAL DE BOM DESPACHO-MG PROCESSO SELETIVO SIMPLIFICADO - EDITAL 001/2009 CARGO: COORDENADOR DE INCLUSÃO DIGITAL CADERNO DE PROVAS
CADERNO DE PROVAS 1 A prova terá a duração de duas horas, incluindo o tempo necessário para o preenchimento do gabarito. 2 Marque as respostas no caderno de provas, deixe para preencher o gabarito depois
Introdução à Tecnologia Web HTML HyperText Markup Language XHTML extensible HyperText Markup Language Estrutura Básica do Documento HTML
IntroduçãoàTecnologiaWeb HTML HyperTextMarkupLanguage XHTML extensiblehypertextmarkuplanguage EstruturaBásicadoDocumentoHTML ProfªMSc.ElizabeteMunzlinger www.elizabete.com.br ProfªMSc.ElizabeteMunzlinger
Esse manual é um conjunto de perguntas e respostas para usuários(as) do Joomla! 1.5.
Esse manual é um conjunto de perguntas e respostas para usuários(as) do Joomla! 1.5. Ele considera que você já tem o Joomla! instalado no seu computador. Caso você queira utilizá lo em um servidor na web,
Certificado ISO 9001:2000 Nº 23.0021/98. Centro de Informática CETEP Quintino www.ciquintino.com.br. Elaborada por: Wanderson Mirandela
Certificado ISO 9001:2000 Nº 23.0021/98 Centro de Informática CETEP Quintino www.ciquintino.com.br Elaborada por: Wanderson Mirandela A POLÍTICA DA QUALIDADE DO CI Prover cursos de nível básico profissionalizante
Projeto ECA na Escola - Plataforma de Educação à Distância
Página1 Apresentação Projeto ECA na Escola - Plataforma de Educação à Distância Olá Participante do Projeto ECA na Escola, Este tutorial pretende auxiliá-lo na navegação na Plataforma de Educação à Distância
6. Enumere de acordo com a primeira: A. Minimizar diminui o aplicativo, deixando-o na Barra de Tarefas.
LINUX EDUCACIONAL -Assinale a alternativa correta. 1. Para criar uma pasta devemos: Clicar no menu Exibir-Modo de Exibição Clicar com o botão direito onde gostaríamos de criá-la e em seguida Criar Novo
Questões de Informática 2011 - Editores de Texto
1. Existe uma operação específica no Word que serve para destacar um texto selecionado colocando uma moldura colorida em sua volta, como uma caneta "destaque" (iluminadora). Trata-se de a) "Cor da borda".
ROBERTO OLIVEIRA CUNHA
LEIAME APRESENTAÇÃO Nenhuma informação do TUTORIAL DO MICRO- SOFT OFFICE WORD 2003 poderá ser copiada, movida ou modificada sem autorização prévia e escrita do Programador Roberto Oliveira Cunha. Programador:
Simulado Informática Concurso Correios - IDEAL INFO
Simulado Informática Concurso Correios - IDEAL INFO Esta prova de informática é composta por 20 (vinte) questões de múltipla escolha seguindo o molde adotado pela UnB/CESPE. O tempo para a realização deste
Manual de utilização do EAD SINPEEM. EaD Sinpeem
2015 Manual de utilização do EAD SINPEEM EaD Sinpeem 2 SUMÁRIO 1 INTRODUÇÃO... 3 2. COMO ACESSAR UM CURSO... 3 3. COMO ALTERAR MINHA SENHA... 5 4. COMO EDITAR MEU PERFIL... 5 5. COMO ACESSAR O CURSO...
Figura 1: tela inicial do BlueControl COMO COLOCAR A SALA DE INFORMÁTICA EM FUNCIONAMENTO?
Índice BlueControl... 3 1 - Efetuando o logon no Windows... 4 2 - Efetuando o login no BlueControl... 5 3 - A grade de horários... 9 3.1 - Trabalhando com o calendário... 9 3.2 - Cancelando uma atividade
Manual do Usuário CMS WordPress Versão atual: 3.0
Manual do Usuário CMS WordPress Versão atual: 3.0 1 - Introdução O Centro de Gestão do Conhecimento Organizacional, CGCO, criou, em março de 2008, uma equipe para atender à demanda de criação de novos
Sumário. 1. Instalando a Chave de Proteção 3. 2. Novas características da versão 1.3.8 3. 3. Instalando o PhotoFacil Álbum 4
1 Sumário 1. Instalando a Chave de Proteção 3 2. Novas características da versão 1.3.8 3 3. Instalando o PhotoFacil Álbum 4 4. Executando o PhotoFacil Álbum 9 3.1. Verificação da Chave 9 3.1.1. Erro 0001-7