TUTORIAL CSS PRIMEIROS PASSOS COM HTML + CSS

Tamanho: px
Começar a partir da página:

Download "TUTORIAL CSS PRIMEIROS PASSOS COM HTML + CSS"

Transcrição

1 Página 1 Imagem Esta é a tradução do tutorial "Starting with HTML + CSS " de autoria de Bert Bos publicado no site do W3C. 1. A versão oficial e original, em inglês, deste tutorial, encontra-se em: e os seus direitos são conforme: Copyright 2002 W3C (MIT, INRIA, Keio), Todos os direitos reservados. São aplicáveis as disposições do W3C relativas a responsabilidade, marcas, uso de documentos e licença de software 2. A única versão oficial deste documento é a versão em língua inglesa que se encontra no sítio do W3C. 3. O presente documento traduzido para a língua portuguesa do Brasil, pode conter erros de tradução. Este documento foi traduzido em 12 de dezembro de 2004 e atualizado em 27 de dezembro de 2004 por: Maurício Samy Silva e encontra-se hospedado no seu sítio "CSS para WebDesign" em A traduçao foi feita somente para este documento, vale dizer, as páginas remetidas pelos links aqui indicados, estão em sua versão original em língua inglesa. TUTORIAL CSS PRIMEIROS PASSOS COM HTML + CSS Este breve tutorial destina-se àqueles que ainda não escreveram sua primeira folha de estilos e desejam começar a projetar com CSS. Aqui você não encontrará explicações avançadas sobre CSS. Este tutoriai explica como criar um arquivo HTML, um arquivo CSS e como integrá-los de maneira a que funcionem juntos. Após estas noções básicas você poderá ler outros tutoriais e então incrementar os arquivos HTML e CSS aqui criados. Ou ainda, poderá passar a usar um editor adequado para HTML ou CSS, que vai auxiliá-lo a construir sites mais complexos. Abaixo uma visão da página web que construiremos ao longo deste tutorial: Reconheço que não se trata de uma bela página. [Link to the final HTML page] A página web pronta, com seu layout e cores definidas por CSS. Adotei como convenção ao longo do tutorial um sinal de "perigo" como este ao lado esquerdo e uma fonte menor, para indicar um texto opcional contendo uma explicação extra sobre os códigos HTML e CSS do exemplo. O sinal de "perigo" indica um texto contendo técnicas mais avançadas. PASSO 1: ESCREVENDO O HTML Para acompanhar os passos deste tutorial sugiro que você use a mais simples das ferramentas disponíveis isto é, o Notepad (Windows), TextEdit ( Mac) ou KEdit (KDE) pois servirão perfeitamente aos nossos propósitos. Depois que você tiver dominado os fundamentos básicos, talvez queira utilizar ferramentas mais avançadas ou mesmo programas comerciais tais como, Style Master, Dreamweaver ou GoLive. Mas, para seus primeiros passos com CSS não será interessante utilizar-se de ferramentas com recursos mais sofisticados e avançados sobre os quais você não tenha total conhecimento e domínio.

2 Página 2 Não use processadores de textos tais como Microsoft Word ou OpenOffice. Eles geram arquivos que os web browsers não conseguem interpretar. Para códigos HTML e CSS, precisamos de arquivos de texto simples. O passo 1 consiste em abrir seu editor de texto (Notepad, TextEdit, KEdit, ou outro de sua preferência), e digitar o código mostrado abaixo: <!-- Menu de navegacao do site --> <ul class="navbar"> <li><a href="index.html">home page</a> <li><a href="pensamentos.html">pensamentos</a> <li><a href="cidade.html">minha cidade</a> <li><a href="links.html">links</a> </ul> <!-- Conteudo --> <h1>minha primeira página CSS</h1> <p>bem vindos à minha página estilizada! <p>minha página não contém imagens, mas pelo menos está estilizada. Ela contém links, ainda que eles não levem a lugar algum <p>deveria haver mais textos aqui porém eu ainda não decidi o que escrever. <!-- Date e assine sua página, isto é educado! --> <address>construida em 15 de dezembro de 2004<br> por mim mesmo.</address> </body> </html> Na realidade você não precisa digitar o código, simplesmente copie e cole no editor. A primeira linha do código HTML acima informa ao browser qual é o tipo de HTML do código (DOCTYPE significa DOCument TYPE - DOCumento TIPO). No nosso caso trata-se de HTML version (versão) As palavras dentro dos sinais < e > são chamadas de tags e, como você pode notar, o documento está contido dentro das tags e </html>. Entre as tags e poderão estar contidas várias informações que não são mostradas na tela. Note que ali está contido o título (title) do documento e mais adiante você verá que nossa folha de estilos também será colocada ali. A tag contém o texto do documento em si. A princípio tudo que está dentro dela será mostrado na tela exceto textos colocados entre os sinais <!-- e -->, que se destinam a abrigar comentários no código. O browser ignora os comentários. Sobre as demais tags no exemplo, <ul> é para exibir Listas não ordenadas, isto é, uma lista na qual os seus itens não são numerados. A tag <li> é para cada um dos "Itens da lista". A tag <p> é para Parágrafos. E, a tag <a> é para Âncoras, e servem para criar hyperlink.

3 Página 3 O código HTML digitado no NotePad. Se você quiser saber o significado dos nomes dentro dos sinais < > (nomes das tags) um bom lugar para consulta e leitura é Primeiros passos com HTML. Mas, a seguir alguns comentários sobre a estrutura do HTML da nossa página. O elemento ul marca uma lista contendo um hiperlink por item. Esta lista com seus itens se constituirá no "menu de navegação do site", com links para outras páginas do nosso (hipotético) Web Site. Provavelmente todas as páginas do site conterão um menu igual a este. Os elementos h1 e p marcam o conteúdo da página e a assinatura no rodapé da página ( address ) será igual para todas as páginas do site. Observe que eu não usei tags de fechamento para os elementos li e p. Em HTML (ao contrário de XHTML), é permitido omitir as tags de fechamento </li> e </p> e eu as omiti com a finalidade de tornar o texto do código mais legível. Contudo você pode usar as tags de fechamento se assim preferir. Vamos admitir que este será um layout de página que se repetirá várias vezes no Web site. Como é bastante comum em Web sites as páginas se repetem com um mesmo menu de navegação e assinatura e uma área de conteúdo. Agora selecione, no menu "Arquivo" ("File") "Salvar como..." ( Save As ), escolha um diretório e pasta (salvar no Desktop é bem apropriado neste caso) e grave ("salve") o arquivo com o nome de minhapagina.html. Não feche o editor, pois iremos precisar dele mais adiante. (Se você estiver usando o TextEdit para Mac, você deverá informar ao TextEdit que o texto a gravar é do tipo "plain text", para isto vá ao menu Format e selecione Make plain text. A seguir ao salvar o texto e o TextEdit propor adicionar a extensão.txt ao arquivo, escolha Don't append. Algumas vezes o Mac dá uma de inteligente ) A seguir abra o arquivo que você salvou em um browser. Você pode fazer isto da seguinte maneira: procure o arquivo com o gerenciador de arquivos (Windows Explorer, Finder ou Konqueror) e dê um ou dois cliques de mouse sobre o arquivo minhapagina.html. Esta ação deverá fazer com que o arquivo seja aberto no browser default do seu sistema. (Se isto não acontecer abra o seu browser e arraste o arquivo para dentro dele.) Você constatará tratar-se de uma página visualmente inexpressiva... PASSO 2: ADICIONANDO CORES Você muito provavelmente viu algum texto na cor preta sobre um fundo branco, mas isto vai depender de como seu browser está configurado. Uma maneira bem fácil de acresentar estilização à página é adicionar algumas cores a ela. (Mantenha seu browser aberto, vamos usá-lo novamente mais adiante.) Comecemos com uma folha de estilos incorporada ao arquivo HTML. Mais a frente, separaremos os arquivos HTML e CSS. Separar os arquivos é uma boa técnica, pois isto permite usar a mesma folha de estilos para vários arquivos HTML: você precisará escrever uma só folha de estilos. Por ora vamos colocar nossa CSS no mesmo arquivo HTML. Vamos precisar inicialmente do elemento <style> no nosso arquivo HTML. A folha de estilos será colocada dentro deste elemento. Então mãos a obra! volte ao seu editor e acresente mais cinco linhas de código dentro da tag "head" do seu arquivo HTML:

4 Página 4 <style type="text/css"> </style> As linhas a acresentar estão destacadas acima na cor vermelha. A primeira linha informa que trata-se de uma folha de estilos escrita para CSS ( text/css ). A segunda linha diz que as regras de estilo a seguir, aplicam-se ao elemento body. A terceira determina que os textos serão em cor purple (púrpura) e a linha a seguir coloca a cor #d8da3d (amarela esverdeada) para o fundo da página. Em CSS as folhas de estilos são constituidas de regras. Cada regra compõe-se de três partes: 1. um selector (no exemplo: body ), que informa ao browser qual é a parte do documento a qual se aplica a regra; 2. uma propriedade (no exemplo, 'color' e 'background-color', duas propriedades distintas), que especifica qual é o aspecto do layout que está sendo estilizado; 3. e um valor ('purple' e '#d8da3d'), que fornece o valor da propriedade. No exemplo nota-se que as regras podem ser combinadas. Ali estão escritas duas propriedades. Poderíamos ter escrito duas regras separadamente sem combiná-las: color: purple } mas, como as duas regras valem para o elemento body, escrevemos uma só vez o elemento e colocamos as propriedades com seus valores, juntas. Para saber mais sobre seletores consulte capítulo 2 do Lie & Bos. A cor de fundo (background-color) do elemento body valerá para todo o documento. Nós não escrevemos nenhuma regra adicional colocando fundo de outra cor para os outros elementos da página (p, li, address ) então por 'default' eles não terão cor de fundo (ou seja: serão transparentes). A propriedade 'color' determina a cor dos textos para o elemento body e todos os elementos contidos em body herdarão esta cor, a menos que uma outra regra CSS determine uma cor diferente para qualquer elemento na página. (Mais adiante nós escreveremos uma regra assim.) Agora, salve seu arquivo (use Save no menu File ) e volte à janela do seu browser. Dê um "Reload" (Atualizar) na página e seu aspecto mudará, mostrando as cores adicionadas pelas regras CSS escritas. À exceção da lista de links na parte superior, o texto deverá estar na cor púrpura sobre um fundo amarelo esverdeado. A página com cores adicionadas, renderizada em um browser. Cores podem ser escritas em CSS de variadas maneira. Neste exemplo mostrei duas delas: pelo nome da cor ( purple ) e por seu código hexadecimal ( # d8da3d ). Existem cerca de 140 nomes para cores e o código hexadecimal permite especificar mais de 16 milhões de cores. Mais explicações sobre cores em Adicionando um toque de estilo.

5 Página 5 PASSO 3: ADICIONANDO FONTES Outra coisa bem fácil de se estilizar são as fontes para os elementos da página. Vamos escolher fonte Georgia para os textos, exceto para o cabeçalho h1 ao qual atribuiremos a fonte Helvetica. Você nunca terá como saber quais são as fontes que os visitantes do seu site têm instaladas em suas máquinas, por isso é de boa técnica sempre especificarmos fontes alternativas nas folhas de estilos: se a fonte Georgia não estiver disponível as fontes Times New Roman ou Times irá substituí-la sem grandes prejuízos e aida mais, se ambas também estiverem indisponíveis o browser do visitante usará uma fonte (with serif) com serifas. Se a fonte Helvetica não estiver instalada, as fontes Geneva, Arial e SunSans-Regular são similares e se nenhuma delas estiver disponível o browser usará uma fonte sem serifas. No seu editor de textos acresente mais estas linhas: <style type="text/css"> font-family: Georgia, "Times New Roman", Times, serif; h1 { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif } </style> Salve o arquivo, abra novamente o browser e dê um "Reload" (Atualizar) na página para visualizar as fontes diferentes para o cabeçalho h1 e o restante do texto. Agora cabeçalho e texto estão com fontes diferentes. PASSO 4: ADICIONANDO O MENU DE NAVEGAÇÃO

6 Página 6 A lista no topo da página destina-se a se constituir no menu de navegação. Web sites em geral tem uma barra de navegação disposta horizontalmente no topo ou um menu na lateral da página e nossa página também terá seu menu de navegação. Usaremos um menu na lateral esquerda, por considerarmos mais interessante que uma barra no topo... Nosso menu já esta no código HTML da página. Ele é a lista <ul> no topo. Os links ali inseridos não levam a lugar algum pois nosso Web site tem uma só página, mas isto não é importante agora. Em um Web site real, é óbvio, não devemos ter nenhum link "quebrado". Agora precisamos mover a lista para a esquerda e o restante do texto para a direita com a finalidade de abrir espaço para a lista. As propriedades CSS que usaremos para isto são 'padding-left' (para mover o texto para a direita) e 'position', 'left' e 'top' (para posicionar o menu). Existem outras maneiras de se fazer isto. Se você der uma olhada em column ou layout na página Aprendendo CSS, vai encontrar vários templates para layout. Mas para o nosso exemplo as propriedades citadas acima são adequadas. No editor de texto adicione mais estas linhas no arquivo HTML: <style type="text/css"> padding-left: 11em; font-family: Georgia, "Times New Roman", Times, serif; ul.navbar { position: absolute; top: 2em; left: 1em; width: 9em } h1 { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif } </style> Salve o arquivo e dê "Reload" (Atualizar) no browser para ver o menu a esquerda do texto. Agora nossa página já esta mais interessante, não é mesmo? O texto principal à direita e a lista de links à esquerda. A regra 'position: absolute' determina que o elemento ul seja posicionado na página independentemente de qualquer texto que venha antes ou depois no código HTML e as propriedades 'left' e 'top' indicam qual a posição a ocupar. No nosso caso, 2em abaixo do topo e 1em para a direita do lado esquerdo da janela do browser.

7 Página 7 '2em' significa 2 vezes o tamanho da fonte adotada. Por exemplo: se o menu está com fonte de 12 points, 2em equivalem a 24 points. A unidade 'em' é muito usada em CSS, pois ela permite que as medidas se adaptem automaticamente ao tamanho de fonte que os usuários costumam utilizar em suas preferências pessoais. A maioria dos browsers possuem a facilidade de permitir que o usuário aumente ou diminua o tamanho de fonte ao visualizar uma página web: faça você mesmo uma experiência em seu browser aumentando e diminuindo o tamanho da fonte e observe como o tamanho do nosso menu acompanha o aumento e diminuição da fonte. Isto não aconteceria se tivessemos usado um tamanho para o menu em pixel. PASSO 5: ESTILIZANDO OS LINKS O menu de navegação mais se parece com uma lista do que com um menu. Vamos estilizá-lo. Comecemos removendo os marcadores de lista e deslocando o menu mais para a esquerda, para o lugar agora ocupado pelos marcadores. Vamos acresentar um fundo branco para os itens da lista e também um quadradro preto. (Por que fazer isto? Simplesmente porque isto é possível, sem qualquer motivo adicional.) Até agora ainda não definimos as cores para os links, então esta é a hora: azul para links não visitados e púrpura para links já visitados: <style type="text/css"> padding-left: 11em; font-family: Georgia, "Times New Roman", Times, serif; ul.navbar { list-style-type: none; padding: 0; margin: 0; position: absolute; top: 2em; left: 1em; width: 9em } h1 { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif } ul.navbar li { background: white; margin: 0.5em 0; padding: 0.3em; border-right: 1em solid black } ul.navbar a { text-decoration: none } a:link { color: blue } a:visited { color: purple } </style> Tradicionalmente os browsers renderizam os hyperlinks com um sublinhado e com cores. Usualmente as cores adotadas pelos browsers são as mesmas que adotamos no nosso exemplo: azul para links não visitados (ou visitados há muito tempo) e púrpura para links já visitados. Em HTML, criamos hyperlinks com o elemento <a>, assim para especificar cores para links estabelecemos regras CSS para "a". Para fazermos diferenciação entre links visitados e não visitados estão previstas duas "pseudo-classes" CSS (:link e :visited). Elas são chamadas de "pseudo-classes" para diferenciá-las das classe de atributos, que são usadas nos código HTML, por exemplo a class="navbar" do nosso exemplo. PASSO 6: ADICIONANDO UMA LINHA HORIZONTAL A última regra para estilização que escreveremos em nosso exemplo será para adicionar uma linha horizontal separando o texto principal da assinatura ao pé da página. Usaremos a propriedade 'border-top' para colocar uma linha horizontal pontilhada acima do elemento <address>:

8 Página 8 <style type="text/css"> padding-left: 11em; font-family: Georgia, "Times New Roman", Times, serif; ul.navbar { list-style-type: none; padding: 0; margin: 0; position: absolute; top: 2em; left: 1em; width: 9em } h1 { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif } ul.navbar li { background: white; margin: 0.5em 0; padding: 0.3em; border-right: 1em solid black } ul.navbar a { text-decoration: none } a:link { color: blue } a:visited { color: purple } address { margin-top: 1em; padding-top: 1em; border-top: thin dotted } </style> Aqui completamos a folha de estilos. A seguir vamos ver como colocar a folha de estilos em um arquivo separado e com isto usar uma folha para várias páginas. PASSO 7: COLOCANDO A FOLHA DE ESTILOS EM UM ARQUIVO SEPARADO Temos agora um arquivo HTML com uma folha de estilos incorporada. Quando nosso site crescer, provavelmente muitas páginas deverão compartilhar a mesma folha de estilos. Existe uma maneira bem mais racional do que sair copiando a folha de estilos em cada uma das páginas do Web site: se colocarmos a folha de estilos em um arquivo separado, todas as páginas do site poderão conter um link apontando para este arquivo. Para nosso arquivo de folha de estilo precisaremos criar um outro arquivo de texto. Escolha New no menu File do seu editor de texto (Se estiver usando o TextEdit, não se esqueça do plain text usando o Format menu.) A seguir, no editor, copie tudo o que estiver dentro do elemento <style> no HTML e cole no arquivo novo que você acabou de criar. Não copie as tags <style> e </style>. Elas são do HTML e não pertencem ao arquivo CSS. Agora na nova janela do editor que você abriu deverá estar com esta folha de estilos: padding-left: 11em; font-family: Georgia, "Times New Roman", Times, serif;

9 Página 9 ul.navbar { list-style-type: none; padding: 0; margin: 0; position: absolute; top: 2em; left: 1em; width: 9em } h1 { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif } ul.navbar li { background: white; margin: 0.5em 0; padding: 0.3em; border-right: 1em solid black } ul.navbar a { text-decoration: none } a:link { color: blue } a:visited { color: purple } address { margin-top: 1em; padding-top: 1em; border-top: thin dotted } Escolha Save As no menu File, e salve com o nome meuestilo.css no mesmo diretório/pasta onde está o arquivo minhapagina.html. Agora volte para o arquivo HTML. Apague tudo que estiver dentro do elemento <style> incluindo <style> e </style> e coloque no lugar um elemento <link> como mostrado abaixo: <link rel="stylesheet" href="meuestilo.css"> Este link informa ao browser que que a folha de estilos para a página está em um arquivo chamado meuestilo.css e como nenhum diretório está indicado no caminho do link o browser procurará no mesmo diretório do arquivo HTML. Se você salvar o arquivo HTML e der um "Reload" (Atualizar) na página, nenhuma mudança ocorrerá: a página continua estilizada da mesma maneira mas agora as regras de estilo estão em um arquivo externo. O resultado final

10 Página 10 O próximo passo agora é carregar os arquivos criados, minhapagina.html e meuestilo.css para seu Web site. (Bem, talvez você queira fazer algumas mudanças antes...) Agora, como fazer isto vai depender do seu provedor Internet. LEITURA COMPLEMENTAR Para uma Introdução às CSS ver capítulo 2 de Lie & Bos, oudave Raggett's introdução às CSS. Outras informações e tutoriais encontram-se na página aprendendo CSS. [CSS Feito] [CSS Válido] [XHTML1 Válido] Bert Bos CSS Contact Criado em 05 Abr Atualizado $Data: 2004/12/25 11:53:18 $ GMT

02 - Usando o SiteMaster - Informações importantes

02 - Usando o SiteMaster - Informações importantes 01 - Apresentação do SiteMaster - News Edition O SiteMaster foi desenvolvido para ser um sistema simples de gerenciamento de notícias, instalado em seu próprio computador e com configuração simplificada,

Leia mais

7. Cascading Style Sheets (CSS)

7. Cascading Style Sheets (CSS) 7. Cascading Style Sheets (CSS) O CSS (Folha de Estilo em Cascata) é um padrão de formatação para páginas web que vai além das limitações impostas pelo HTML. O Cascading Style Sheets não é exatamente uma

Leia mais

WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira

WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira WEBDESIGN Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Recursos avançados com CSS Uma vez entendido o uso básico e treinado muito, chegou

Leia mais

Roteiro 2: Conceitos de Tags HTML

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

Leia mais

CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata

CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata CSS CSS é a abreviatura para Cascading Style Sheets Folhas de Estilo em Cascata CSS é uma linguagem para estilos (formatação) que define o layout de documentos HTML. CSS controla fontes, cores, margens,

Leia mais

QUEM FEZ O TRABALHO?

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

Leia mais

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova.

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova. 3.5 Páginas: Ao clicar em Páginas, são exibidas todas as páginas criadas para o Blog. No nosso exemplo já existirá uma página com o Título Página de Exemplo, criada quando o WorPress foi instalado. Ao

Leia mais

HTML 5 + CSS APRESENTANDO O CSS ESTILOS LOCAIS

HTML 5 + CSS APRESENTANDO O CSS ESTILOS LOCAIS APRESENTANDO O CSS CSS Cascading Style Sheets, ou, em português, Folha de Estilo em Cascata - é uma linguagem de estilo que pode ser utilizada na formatação de documentos HTML. Com CSS, podemos criar regras

Leia mais

CRIAÇÃO DE SITES (AULA 7)

CRIAÇÃO DE SITES (AULA 7) Prof. Breno Leonardo Gomes de Menezes Araújo brenod123@gmail.com http://blog.brenoleonardo.com.br CRIAÇÃO DE SITES (AULA 7) CSS significa CascadingStyleSheetes(Folhas de Estilo em Cascata). Não seria ótimo

Leia mais

Google Drive: Acesse e organize seus arquivos

Google Drive: Acesse e organize seus arquivos Google Drive: Acesse e organize seus arquivos Use o Google Drive para armazenar e acessar arquivos, pastas e documentos do Google Docs onde quer que você esteja. Quando você altera um arquivo na web, no

Leia mais

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova.

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova. 3.5 Páginas: Ao clicar em Páginas, são exibidas todas as páginas criadas para o Blog. No nosso exemplo já existirá uma página com o Título Página de Exemplo, criada quando o WorPress foi instalado. Ao

Leia mais

MANUAL DO ANIMAIL 1.0.0.1142 Terti Software

MANUAL DO ANIMAIL 1.0.0.1142 Terti Software O Animail é um software para criar campanhas de envio de email (email Marketing). Você pode criar diversas campanhas para públicos diferenciados. Tela Principal do sistema Para melhor apresentar o sistema,

Leia mais

CRIANDO TEMPLATES E LEGENDAS

CRIANDO TEMPLATES E LEGENDAS CRIANDO TEMPLATES E LEGENDAS Este tutorial tem como objetivo instruir passo à passo como criar templates de peças, utilizar os novos recursos de cadastro de propriedade de peças e criação de legenda. 1-

Leia mais

Desenvolvedor Web Docente André Luiz Silva de Moraes

Desenvolvedor Web Docente André Luiz Silva de Moraes Roteiro 3: Layout básico e Div's: técnicas com uso de ID's e Classes Objetivos Compreender a importância do uso de Elementos de Div no desenvolvimento de Layouts de página; Explorar e aplicar o uso de

Leia mais

Tutorial Módulo 1: Introdução e primeiros passos Por Daniel Chicayban (dan@trendnet.com.br)

Tutorial Módulo 1: Introdução e primeiros passos Por Daniel Chicayban (dan@trendnet.com.br) Tutorial Módulo 1: Introdução e primeiros passos Por Daniel Chicayban (dan@trendnet.com.br) Introdução A HyperText Markup Language e a Web No núcleo de toda página da Web, encontramos a HyperText Markup

Leia mais

Introdução ao Tableau Server 7.0

Introdução ao Tableau Server 7.0 Introdução ao Tableau Server 7.0 Bem-vindo ao Tableau Server; Este guia orientará você pelas etapas básicas de instalação e configuração do Tableau Server. Em seguida, usará alguns dados de exemplo para

Leia mais

Tutorial Plone 4. Manutenção de Sites. Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados

Tutorial Plone 4. Manutenção de Sites. Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados Tutorial Plone 4 Manutenção de Sites Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados Sumário Introdução 1 Como fazer a autenticação do usuário 1.1 Através do

Leia mais

Manual do Google agenda. criação e compartilhamento de agendas

Manual do Google agenda. criação e compartilhamento de agendas Manual do Google agenda criação e compartilhamento de agendas 1 O que é o Google Agenda? Google Agenda é um serviço de agenda on line gratuito do Google, onde você pode anotar compromissos e tarefas, organizando

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Introdução Nesta quinta edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos o estudo do Windows Mail, um cliente

Leia mais

FERRAMENTAS DE COLABORAÇÃO CORPORATIVA

FERRAMENTAS DE COLABORAÇÃO CORPORATIVA FERRAMENTAS DE COLABORAÇÃO CORPORATIVA Compartilhamento de Arquivos no Google Drive Sumário (Clique sobre a opção desejada para ir direto à página correspondente) Utilização do Google Grupos Introdução...

Leia mais

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. 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,

Leia mais

APOSTILA DE EXEMPLO. (Esta é só uma reprodução parcial do conteúdo)

APOSTILA DE EXEMPLO. (Esta é só uma reprodução parcial do conteúdo) APOSTILA DE EXEMPLO (Esta é só uma reprodução parcial do conteúdo) 1 Índice Aula 1 - Área de trabalho e personalizando o sistema... 3 A área de trabalho... 3 Partes da área de trabalho.... 4 O Menu Iniciar:...

Leia mais

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 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

Leia mais

Kobo Desktop. Manual do Usuário

Kobo Desktop. Manual do Usuário Kobo Desktop Manual do Usuário Kobo Desktop Manual Do Usuário Índice Sobre o Kobo Desktop... 4 Como baixar e instalar o Kobo Desktop... 5 Como instalar o Kobo Desktop para Windows... 5 Como instalar o

Leia mais

Passa a passo para construir uma página pessoal - Parte 1

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):

Leia mais

Como incluir artigos:

Como incluir artigos: Como incluir artigos: O WordPress é uma ferramenta muito flexível, com muitas variações e ajustes que podem torná-lo algo muito simples e também muito sofisticado conforme os recursos que são configurados

Leia mais

Série ArcGIS Online I. Aprenda em 20. Módulo 4. Configure pop-ups. www.academiagis.com.br

Série ArcGIS Online I. Aprenda em 20. Módulo 4. Configure pop-ups. www.academiagis.com.br Série ArcGIS Online I Aprenda em 20 Módulo 4 Configure pop-ups Junho/2015 academiagis@img.com.br www.academiagis.com.br 1 Configure pop-ups No módulo 3, você trabalhou com várias propriedades diferentes

Leia mais

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. 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

Leia mais

Introdução às Folhas de Estilo

Introdução às Folhas de Estilo Introdução às Folhas de Estilo Folhas de Estilo Cascading Style Sheets (CSS). Separa aparência e estrutura do documento. Permite maior controle sobre a apresentação das páginas Margens Tamanho / tipo de

Leia mais

Manual de utilização do Portal Entrelace.org.br. William Oyama www.evisionbrasil.com.br

Manual de utilização do Portal Entrelace.org.br. William Oyama www.evisionbrasil.com.br Manual de utilização do Portal Entrelace.org.br William Oyama www.evisionbrasil.com.br Índice do tutorial 1 Portal entrelace.obr.br 2- Painel Administrativo 3- Informações Restritas 4- Acervo 5- Notícias

Leia mais

Configuração de assinatura de e-mail

Configuração de assinatura de e-mail Configuração de assinatura de e-mail Este manual irá lhe auxiliar a configurar a sua assinatura de E-mail no Microsoft Outlook (Desktop) e no Outlook Web App (Webmail). Gerando a sua assinatura de e-mail

Leia mais

Web Design Aula 13: Introdução a CSS

Web Design Aula 13: Introdução a CSS Web Design Aula 13: Introdução a CSS Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação Você lembra que HTML e XHTML são linguagens de marcação? Para organizar melhor o visual das páginas

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Introdução Nesta útima edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos dos clientes Yahoo! Mail

Leia mais

Sumário. Tutorial: Editor de Exercícios Online para o professor

Sumário. Tutorial: Editor de Exercícios Online para o professor 1 Sumário Inserir Exercícios... 4 Minhas Avaliações... 5 Cadastrar perguntas... 7 Inserindo imagens... 10 Inserindo arquivos... 13 Inserindo vídeos... 15 Gerenciador de fórmulas e equações matemáticas...

Leia mais

Manual de Utilização COPAMAIL. Zimbra Versão 8.0.2

Manual de Utilização COPAMAIL. Zimbra Versão 8.0.2 Manual de Utilização COPAMAIL Zimbra Versão 8.0.2 Sumário ACESSANDO O EMAIL... 1 ESCREVENDO MENSAGENS E ANEXANDO ARQUIVOS... 1 ADICIONANDO CONTATOS... 4 ADICIONANDO GRUPOS DE CONTATOS... 6 ADICIONANDO

Leia mais

3. No painel da direita, dê um clique com o botão direito do mouse em qualquer espaço livre (área em branco).

3. No painel da direita, dê um clique com o botão direito do mouse em qualquer espaço livre (área em branco). Permissões de compartilhamento e NTFS - Parte 2 Criando e compartilhando uma pasta - Prática Autor: Júlio Battisti - Site: www.juliobattisti.com.br Neste tópico vamos criar e compartilhar uma pasta chamada

Leia mais

Dicas para usar melhor o Word 2007

Dicas para usar melhor o Word 2007 Dicas para usar melhor o Word 2007 Quem está acostumado (ou não) a trabalhar com o Word, não costuma ter todo o tempo do mundo disponível para descobrir as funcionalidades de versões recentemente lançadas.

Leia mais

Mudança de formatos no HTML. CSS - Cascading Style Sheets. A prioridade para o efeito cascata. A prioridade para o efeito cascata

Mudança de formatos no HTML. CSS - Cascading Style Sheets. A prioridade para o efeito cascata. A prioridade para o efeito cascata Mudança de formatos no HTML título CSS - Cascading Style Sheets e os problemas do HTML Para mudar a cor de uma única linha de uma página seria relativamente fácil.

Leia mais

O sistema está pedindo que eu faça meu login novamente e diz que minha sessão expirou. O que isso significa?

O sistema está pedindo que eu faça meu login novamente e diz que minha sessão expirou. O que isso significa? Que tipo de navegadores são suportados? Preciso permitir 'cookies' O que são 'cookies' da sessão? O sistema está pedindo que eu faça meu login novamente e diz que minha sessão expirou. O que isso significa?

Leia mais

Como instalar o Kobo Desktop para Windows... 5. Como instalar o Kobo Desktop para Mac... 6. Como classificar a sua biblioteca...

Como instalar o Kobo Desktop para Windows... 5. Como instalar o Kobo Desktop para Mac... 6. Como classificar a sua biblioteca... Kobo Desktop Manual Do Utilizador Índice Sobre o Kobo Desktop... 4 Como baixar e instalar o Kobo Desktop... 5 Como instalar o Kobo Desktop para Windows... 5 Como instalar o Kobo Desktop para Mac... 6 Como

Leia mais

Como produzir e publicar uma apresentação online dinâmica (Prezi)

Como produzir e publicar uma apresentação online dinâmica (Prezi) Como produzir e publicar uma apresentação online dinâmica (Prezi) Este módulo irá ensinar-lhe como produzir e publicar uma apresentação online dinâmica usando o programa Prezi. A produção de uma apresentação

Leia mais

TUTORIAL COMO CRIAR E EDITAR UM VÍDEO NO WINDOWS MOVIE MAKER*

TUTORIAL COMO CRIAR E EDITAR UM VÍDEO NO WINDOWS MOVIE MAKER* TUTORIAL COMO CRIAR E EDITAR UM VÍDEO NO WINDOWS MOVIE MAKER* * Microsoft Windows MovieMakeré um programa da Microsoft Corporation. A versão utilizada é a 5.1 que já vem instalada no Microsoft Windows

Leia mais

BEM-VINDO AO dhl PROVIEW

BEM-VINDO AO dhl PROVIEW BEM-VINDO AO dhl PROVIEW Guia de Usuário O DHL PROVIEW COLOCA VOCÊ NO CONTROLE DE SEUS ENVIOS. PROVIEW O DHL ProView é uma ferramenta de rastreamento on-line que permite o gerenciamento dos envios, a programação

Leia mais

CSS - Background, Color e Fontes. Prof. Bruno Medeiros bruno.medeiros@sc.senai.br http://www.bruno.dump.com.br

CSS - Background, Color e Fontes. Prof. Bruno Medeiros bruno.medeiros@sc.senai.br http://www.bruno.dump.com.br Web Introdução Design CSS - Background, Color e Fontes Prof. Bruno Medeiros bruno.medeiros@sc.senai.br http://www.bruno.dump.com.br O que veremos... CSS Cores e fundos Fontes Cores e fundos Algumas propriedades

Leia mais

Manual do Painel Administrativo

Manual do Painel Administrativo Manual do Painel Administrativo versão 1.0 Autores César A Miggiolaro Marcos J Lazarin Índice Índice... 2 Figuras... 3 Inicio... 5 Funcionalidades... 7 Analytics... 9 Cidades... 9 Conteúdo... 10 Referência...

Leia mais

Intel Teach Program Essentials Course. Tutorial para wik.is

Intel Teach Program Essentials Course. Tutorial para wik.is Tutorial para wik.is Esse documento inclui os passos e sugestões para estabelecer um wiki site para o Curso Essencial do Programa Intel Educar ou para sua própria turma. Essas instruções se aplicam para

Leia mais

Como criar pastas personalizadas e novas peças no Toolbox

Como criar pastas personalizadas e novas peças no Toolbox Como criar pastas personalizadas e novas peças no Toolbox Neste tutorial apreenderemos como inserir uma nova pasta no toolbox, inserir novas peças na biblioteca do toolbox e criar propriedades personalizadas

Leia mais

Bem vindo ao ajuda do software QUICKFISH para criação de sites.

Bem vindo ao ajuda do software QUICKFISH para criação de sites. Bem vindo ao ajuda do software QUICKFISH para criação de sites. SUMÁRIO 1 Exemplo de site criado no software QUICKFISH...02 2 Salvando Seu Site...03 3 Publicando Seu Site...03 4 Visão inicial do Software

Leia mais

Web Design Aula 02: HTML

Web Design Aula 02: HTML Web Design Aula 02: HTML Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação Roteiro Introdução Conceitos HTML Primeira Página Identação Incluindo o título Salvando a página Vizualizando

Leia mais

TABLELESS E PROJETO ESTRUTURAL

TABLELESS E PROJETO ESTRUTURAL Barra Lateral 1 Barra Lateral 2 Barra Lateral 2 Barra Lateral Barra Lateral DISCIPLINA: FUNDAMENTOS E TECNOLOGIA EM WEB Professora: Adriana Silva TABLELESS E PROJETO ESTRUTURAL O termo TABLELESS refere-se

Leia mais

LINGUAGEM DE PROGRAMAÇÃO HTML COMPONENTES: ROBSON EDMILSON

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

Leia mais

Banner Flutuante. Dreamweaver

Banner Flutuante. Dreamweaver Banner Flutuante Dreamweaver Começamos com um arquivo em branco no Dreamweaver MX. Para que o banner apareça sobre a página, precisamos inserir uma camada a mais no arquivo HTML. Selecione o menu Inserir

Leia mais

Tutorial SGCD. 1. Efetuando Login no Sistema. 2. Criando uma nova página. 3. Editando uma página já existente

Tutorial SGCD. 1. Efetuando Login no Sistema. 2. Criando uma nova página. 3. Editando uma página já existente Tutorial SGCD 1. Efetuando Login no Sistema 2. Criando uma nova página 3. Editando uma página já existente 4. Anexando arquivos em páginas e no menu esquerdo 5. Colocando Imagens em páginas 6. Colocando

Leia mais

A seguir voce vai poder acompanhar, em 10 passos, como gerenciar o conteúdo das páginas pelas quais voce é responsável.

A seguir voce vai poder acompanhar, em 10 passos, como gerenciar o conteúdo das páginas pelas quais voce é responsável. A seguir voce vai poder acompanhar, em 10 passos, como gerenciar o conteúdo das páginas pelas quais voce é responsável. Índice Geral TULogarUT 3 TUConhecer e VisualizarUT 6 TUÁrea de Edição / Blocos e

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft Word 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Barra de Ferramentas de Acesso Rápido

Leia mais

TUTORIAL AUTODESK 360 COLABORAÇÃO E ARMAZENAMENTO DE ARQUIVOS

TUTORIAL AUTODESK 360 COLABORAÇÃO E ARMAZENAMENTO DE ARQUIVOS TUTORIAL AUTODESK 360 COLABORAÇÃO E ARMAZENAMENTO DE ARQUIVOS Autodesk 360 é a nuvem da Autodesk, podendo ser acessada pela sua conta da Autodesk Education Community (estudantes) ou Autodesk Academic Resource

Leia mais

Programação para Internet

Programação para Internet Programação para Internet Aula 07 Os direitos desta obra foram cedidos à Universidade Nove de Julho Este material é parte integrante da disciplina oferecida pela UNINOVE. O acesso às atividades, conteúdos

Leia mais

AULA: BrOffice Impress terceira parte. Ao final dessa aula, você deverá ser capaz de:

AULA: BrOffice Impress terceira parte. Ao final dessa aula, você deverá ser capaz de: AULA: BrOffice Impress terceira parte Objetivo Ao final dessa aula, você deverá ser capaz de: Conhecer a integração dos softwares do BrOffice; Aprender a trabalhar no slide mestre; Utilizar interação entre

Leia mais

EXEMPLO. h1 {font-family: arial, verdana, sans-serif;} h2 {font-family: "Times New Roman", serif;}

EXEMPLO. h1 {font-family: arial, verdana, sans-serif;} h2 {font-family: Times New Roman, serif;} Fontes A propriedade font-family é usada para definir uma lista de fontes e sua prioridade para apresentação de um elemento em uma página. Se a primeira fonte da lista não estiver instalada na máquina

Leia mais

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 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,

Leia mais

Manual de configuração do sistema

Manual de configuração do sistema Manual de configuração do sistema (v.1.5.x Beta) Rua México, 119 Sala 2004 Centro Rio de Janeiro, RJ www.doctors-solution.com.br www.simdoctor.com.br contato@simdoctor.com.br Sumário 1. Fazendo seu primeiro

Leia mais

Fluxo de trabalho do Capture Pro Software: Indexação de OCR e separação de documentos de código de correção

Fluxo de trabalho do Capture Pro Software: Indexação de OCR e separação de documentos de código de correção Este procedimento corresponde ao fluxo de trabalho de Indexação de OCR com separação de código de correção no programa de treinamento do Capture Pro Software. As etapas do procedimento encontram-se na

Leia mais

COMO COLABORAR NO WIKI DO MOODLE 1. Orientações para produção escolar colaborativa no wiki do Moodle:

COMO COLABORAR NO WIKI DO MOODLE 1. Orientações para produção escolar colaborativa no wiki do Moodle: COMO COLABORAR NO WIKI DO MOODLE 1 Ilse Abegg e Fábio da Purificação de Bastos e-mail: iabegg@mail.ufsm.br O wiki no Moodle é uma ferramenta de atividade que visa produção escolar colaborativa. Isso significa

Leia mais

Tutorial Gerar arquivo PDF. Gerando um documento pdf com várias imagens 1- Inserir imagem no Word

Tutorial Gerar arquivo PDF. Gerando um documento pdf com várias imagens 1- Inserir imagem no Word Tutorial Gerar arquivo PDF. Com o objetivo de simplificar e diminuir o tamanho de arquivos anexos nos projetos, elaboramos um pequeno tutorial mostrando como gerar um único arquivo no formato pdf contendo

Leia mais

ALUNES MANUAL DO USUÁRIO. Guia rápido Alunes

ALUNES MANUAL DO USUÁRIO. Guia rápido Alunes ALUNES MANUAL DO USUÁRIO Guia rápido Alunes 1 Manual de Instruções Versão 2.0 Alunes Informática 2 Sumário Introdução... 5 Pré-requisitos... 5 Principal/Home... 6 Como editar texto do home... 7 Desvendando

Leia mais

Web Design Aula 15: Conhecendo CSS

Web Design Aula 15: Conhecendo CSS Web Design Aula 15: Conhecendo CSS Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Roteiro Agrupando Seletores Herança Comentários Exercício Adicionando Classes Validação Propriedades Agrupando

Leia mais

Manual de Publicaça o no Blog da Aça o TRIBOS nas Trilhas da Cidadania

Manual de Publicaça o no Blog da Aça o TRIBOS nas Trilhas da Cidadania Manual de Publicaça o no Blog da Aça o TRIBOS nas Trilhas da Cidadania Sumário Objetivos do Blog... 2 Log-in... 3 Esqueci minha senha... 4 Utilizando o Blog... 5 Encontrando seu Blog... 5 Conhecendo o

Leia mais

Novell. Novell Teaming 1.0. novdocx (pt-br) 6 April 2007 EXPLORAR O PORTLET BEM-VINDO DESCUBRA SEU CAMINHO USANDO O NOVELL TEAMING NAVIGATOR

Novell. Novell Teaming 1.0. novdocx (pt-br) 6 April 2007 EXPLORAR O PORTLET BEM-VINDO DESCUBRA SEU CAMINHO USANDO O NOVELL TEAMING NAVIGATOR Novell Teaming - Guia de início rápido Novell Teaming 1.0 Julho de 2007 INTRODUÇÃO RÁPIDA www.novell.com Novell Teaming O termo Novell Teaming neste documento se aplica a todas as versões do Novell Teaming,

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Thunderbird e Terra Nesta terceira edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos do webmail

Leia mais

Construindo Sites com. CSS e (X)HTML. sites controlados por folhas de estilo em cascata. Maurício Samy Silva. Novatec

Construindo Sites com. CSS e (X)HTML. sites controlados por folhas de estilo em cascata. Maurício Samy Silva. Novatec Construindo Sites com CSS e (X)HTML sites controlados por folhas de estilo em cascata Maurício Samy Silva Novatec capítulo 1 Ferramentas básicas de desenvolvimento Este capítulo destina-se aos iniciantes.

Leia mais

Como Gerar documento em PDF com várias Imagens

Como Gerar documento em PDF com várias Imagens Como Gerar documento em PDF com várias Imagens Para Gerar documento em PDF com várias Imagens, temos que seguir dois passos: 1. Inserir Imagens no Word 2. Gerar PDF a partir de documento do Word 1- Inserir

Leia mais

Manual das funcionalidades Webmail AASP

Manual das funcionalidades Webmail AASP Manual das funcionalidades Webmail AASP 1. Configurações iniciais 2. Regras 3. Histórico da conta 4. Autorresposta 5. Dados de acesso (alterando senha de acesso) 6. Identidade (assinatura) 7. Redirecionamento

Leia mais

Manual. V e r s ã o i P a d

Manual. V e r s ã o i P a d Manual V e r s ã o i P a d índice I. Introdução II. Procedimentos básicos III. A agenda IV. Clientes V. Prontuário VI. Configurações VII. Medicamentos VIII. Tags IX. Receitas X. Contato I Introdução O

Leia mais

Professor: Paulo Macos Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 4/6/2011 1

Professor: Paulo Macos Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 4/6/2011 1 Professor: Paulo Macos Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 4/6/2011 1 Do inglês, Cascading Style Sheet, ou folha de estilo em cascata. É uma linguagem

Leia mais

Tutorial do administrador do HelpCenterLive (Sistema de Ajuda)

Tutorial do administrador do HelpCenterLive (Sistema de Ajuda) Tutorial do administrador do HelpCenterLive (Sistema de Ajuda) Sumário Introdução...3 Entrar (Login)...3 Página Inicial (Home Page)...4 Ajuda...5 Conversação (Chat)...6 Mensagens Registradas...7 Registros...8

Leia mais

Adapti - Technology Solutions www.adapti.net Leonor cardoso nº 331 Fone : (041) 8844-7805 81240-380 Curitiba - PR MANUAL DO USUÁRIO

Adapti - Technology Solutions www.adapti.net Leonor cardoso nº 331 Fone : (041) 8844-7805 81240-380 Curitiba - PR MANUAL DO USUÁRIO MANUAL DO USUÁRIO 1 Índice Administração de Documentos...2 Lista de documentos criados...3 Criando um novo documento...3 Barra de ferramentas do editor...4 Editando um documento...7 Administrando suas

Leia mais

Facebook Instruções de integração com PayPal

Facebook Instruções de integração com PayPal Facebook Instruções de integração com PayPal Há diversas formas de utilizar o PayPal para receber pagamentos na plataforma do Facebook. Primeiro você precisa decidir suas necessidades para a opção mais

Leia mais

Guia Site Empresarial

Guia Site Empresarial Guia Site Empresarial Índice 1 - Fazer Fatura... 2 1.1 - Fazer uma nova fatura por valores de crédito... 2 1.2 - Fazer fatura alterando limites dos cartões... 6 1.3 - Fazer fatura repetindo última solicitação

Leia mais

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova.

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova. 6.2.1.5 Páginas: Ao clicar em Páginas, são exibidas todas as páginas criadas para o Blog. No nosso exemplo já existirá uma página com o Título Página de Exemplo, criada quando o WorPress foi instalado.

Leia mais

Web Design. Prof. Felippe

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

Leia mais

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Sumário HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Linguagem HTML HTML é a abreviação de HyperText Markup Language, que pode ser traduzido como Linguagem de Marcação de Hipertexto. Não é uma linguagem

Leia mais

Manual de Utilização do PLONE (Gerenciador de página pessoal)

Manual de Utilização do PLONE (Gerenciador de página pessoal) Manual de Utilização do PLONE (Gerenciador de página pessoal) Acessando o Sistema Para acessar a interface de colaboração de conteúdo, entre no endereço http://paginapessoal.utfpr.edu.br. No formulário

Leia mais

ALBUM DE FOTOGRAFIAS NO POWER POINT

ALBUM DE FOTOGRAFIAS NO POWER POINT ALBUM DE FOTOGRAFIAS NO POWER POINT O PowerPoint é uma poderosa ferramenta que faz parte do pacote Office da Microsoft. O principal uso desse programa é a criação de apresentação de slides, para mostrar

Leia mais

15. OLHA QUEM ESTÁ NA WEB!

15. OLHA QUEM ESTÁ NA WEB! 7 a e 8 a SÉRIES / ENSINO MÉDIO 15. OLHA QUEM ESTÁ NA WEB! Sua home page para publicar na Internet SOFTWARES NECESSÁRIOS: MICROSOFT WORD 2000 MICROSOFT PUBLISHER 2000 SOFTWARE OPCIONAL: INTERNET EXPLORER

Leia mais

Sumário INTRODUÇÃO... 3. 1. Acesso ao Ambiente do Aluno... 4. 2. Ferramentas e Configurações... 5. 2.1 Ver Perfil... 5. 2.2 Modificar Perfil...

Sumário INTRODUÇÃO... 3. 1. Acesso ao Ambiente do Aluno... 4. 2. Ferramentas e Configurações... 5. 2.1 Ver Perfil... 5. 2.2 Modificar Perfil... Sumário INTRODUÇÃO... 3 1. Acesso ao Ambiente do Aluno... 4 2. Ferramentas e Configurações... 5 2.1 Ver Perfil... 5 2.2 Modificar Perfil... 6 2.3 Alterar Senha... 11 2.4 Mensagens... 11 2.4.1 Mandando

Leia mais

MICROSOFT EXCEL - AULA NÚMERO 06

MICROSOFT EXCEL - AULA NÚMERO 06 MICROSOFT EXCEL - AULA NÚMERO 06 IMPRIMINDO PLANILHAS E GRÁFICOS Até este ponto, você viu como introduzir dados e criar formulas, formatar texto e criar gráficos. Agora você vai apresentar os dados ou

Leia mais

Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com

Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Desenvolvimento em Ambiente Web Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Conceitos de HTML Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Definição de HTML Linguagem de marcadores (tags).

Leia mais

Ela funciona de um jeito parecido com as mídia de RSS próprio: o sistema acessa o feed do twitter e exibe, na tela, os últimos tweets.

Ela funciona de um jeito parecido com as mídia de RSS próprio: o sistema acessa o feed do twitter e exibe, na tela, os últimos tweets. Mídia do Twitter Esta mídia serve para mostrar os últimos tweets de uma conta específica. É útil para estabelecimentos que usam com frequência o twitter e que desejam que seus clientes acompanhem isso

Leia mais

INTRODUÇÃO AO DESENVOLVIMENTO WEB. PROFª. M.Sc. JULIANA H Q BENACCHIO

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

Leia mais

Lição 1 - Criação de campos calculados em consultas

Lição 1 - Criação de campos calculados em consultas 1 de 5 21-08-2011 22:15 Lição 1 - Criação de campos calculados em consultas Adição de Colunas com Valores Calculados: Vamos, inicialmente, relembrar, rapidamente alguns conceitos básicos sobre Consultas

Leia mais

Barra de ferramentas padrão. Barra de formatação. Barra de desenho Painel de Tarefas

Barra de ferramentas padrão. Barra de formatação. Barra de desenho Painel de Tarefas Microsoft Power Point 2003 No Microsoft PowerPoint 2003, você cria sua apresentação usando apenas um arquivo, ele contém tudo o que você precisa uma estrutura para sua apresentação, os slides, o material

Leia mais

Universidade Federal do Mato Grosso - STI-CAE. Índice

Universidade Federal do Mato Grosso - STI-CAE. Índice CAPA Universidade Federal do Mato Grosso - STI-CAE Índice 1. Página da área administrativa... 1.1 Botões e campo iniciais... 2. Explicar como funcionam as seções... 2.1. Seções dinâmicos... 2.1.1 Como

Leia mais

TUTORIAL DO ACCESS PASSO A PASSO. I. Criar um Novo Banco de Dados. Passos: 1. Abrir o Access 2. Clicar em Criar um novo arquivo

TUTORIAL DO ACCESS PASSO A PASSO. I. Criar um Novo Banco de Dados. Passos: 1. Abrir o Access 2. Clicar em Criar um novo arquivo TUTORIAL DO ACCESS PASSO A PASSO I. Criar um Novo Banco de Dados Passos: 1. Abrir o Access 2. Clicar em Criar um novo arquivo 3. Clicar em Banco de Dados em Branco 4. Escrever um nome na caixa de diálogo

Leia mais

Scientific Electronic Library Online

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

Leia mais

Google Drive. Passos. Configurando o Google Drive

Google Drive. Passos. Configurando o Google Drive Google Drive um sistema de armazenagem de arquivos ligado à sua conta Google e acessível via Internet, desta forma você pode acessar seus arquivos a partir de qualquer dispositivo que tenha acesso à Internet.

Leia mais

Manual do Publicador. Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web

Manual do Publicador. Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web Manual do Publicador Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web Sumário Painel de Administração... 3 1 - Inserção de post... 5 2 Publicação de post com notícia na área headline (galeria de

Leia mais

SIMULADOS & TUTORIAIS

SIMULADOS & TUTORIAIS SIMULADOS & TUTORIAIS TUTORIAIS HTML Como utilizar estilos em HTML com CSS Copyright 2013 Todos os Direitos Reservados Jorge Eider F. da Silva Proibida a reprodução deste documento no todo ou em parte

Leia mais

UNIVERSIDADE FEDERAL DE GOIÁS CERCOMP (CENTRO DE RECURSOS COMPUTACIONAIS) TUTORIAL DE USO DO WEBMAIL - UFG

UNIVERSIDADE FEDERAL DE GOIÁS CERCOMP (CENTRO DE RECURSOS COMPUTACIONAIS) TUTORIAL DE USO DO WEBMAIL - UFG UNIVERSIDADE FEDERAL DE GOIÁS CERCOMP (CENTRO DE RECURSOS COMPUTACIONAIS) TUTORIAL DE USO DO WEBMAIL - UFG Página 1 de 26 Sumário Introdução...3 Layout do Webmail...4 Zimbra: Nível Intermediário...5 Fazer

Leia mais

MANUAL DE NAVEGAÇÃO DO MILLENNIUM BUSINESS

MANUAL DE NAVEGAÇÃO DO MILLENNIUM BUSINESS MANUAL DE NAVEGAÇÃO DO MILLENNIUM BUSINESS 1 Conteúdo Apresentação... 3 1 Página Principal do Sistema... 4 2 Telas de busca... 8 3 Teclas de Navegação... 11 4 Tela de Menu de Relatório... 12 5 Telas de

Leia mais