Recurso Didáctico. Dossier Técnico Pedagógico Projecto: 5742/2008/22 Acção: 5742/2008/ Formador[a]
|
|
|
- Rafael Miranda Aragão
- 6 Há anos
- Visualizações:
Transcrição
![Recurso Didáctico Formador[a] Sónia Rodrigues UFCD / UC 0793 Scripts CGI e Folhas de Estilo Data 05/05/2009](/docs-images/75/71501484/images/1-7.jpg "Contextualização / Objectivos Documentação de apoio Orientação Pedagógica Apontamentos de Folhas de Estilo")
1 Recurso Didáctico Formador[a] Sónia Rodrigues UFCD / UC 0793 Scripts CGI e Folhas de Estilo Data 05/05/2009 Contextualização / Objectivos Documentação de apoio Orientação Pedagógica Apontamentos de Folhas de Estilo Pág 1
2 Introdução As folhas de estilo foram criadas para compensar as deficiências da linguagem HTML no que diz respeito configuração da página e à apresentação. Assim, o HTML oferece diversos limites que permitem configurar a página e definir o estilo de um texto, contudo cada elemento possui o seu próprio estilo, independentemente dos elementos que cercam. Graças às folhas de estilo, quando a parte gráfica de um site composto por várias centenas de páginas web deve ser alterada, basta alterar a definição das folhas de estilo num só local para alterar a aparência de todo o site. Chamam-se folhas de estilo em cascata (em inglês Cascading Style Sheets ) porque é possível definir vários estilos e os mesmos podem ser herdados em cascata. As folhas de estilo permitem: Obter uma apresentação homogénea sobre todo o site, recorrendo a uma mesma definição de estilo para todas as páginas; A mudança do aspecto de um site completo inteiro pela única modificação de algumas linhas; Maior legibilidade do HTML, porque os estilos são definidos à parte; Carregamentos de página mais rápidos; Posicionamento mais rigoroso dos elementos. Sintaxe A sintaxe das CSS é composta por três partes: um selector, uma propriedade e um valor, da seguinte forma: selector(propriedade: valor) O selector é normalmente o elemento HTML, ou tag, que se deseja definir, a propriedade é o atributo que se deseja mudar, e cada propriedade pode ter um valor. A propriedade e o valor são separados por dois pontos, e cercado por chavetas, por exemplo: Sintaxe: Selector{propriedade: valor Exemplo: Body { background-color: #FFFFF Exemplo 2: p {font: arial; color: #0000FF Nota: Se o valor possui mais de uma palavra, deve-se colocar aspas em torno do valor: p {font-family: "sans serif" Quando se quer especificar mais do que uma propriedade, deve-se separar cada propriedade com um ponto e vírgula. O exemplo abaixo mostra como definir um parágrafo centrado, com texto de cor vermelho: Pág 2
3 p {text-align: center; color: red E para tornar as definições de estilo mais legíveis, podemos descrever uma propriedade por linha, como visto abaixo: p { text-align: center; color: black; font-family: Arial Comentários em CSS Como em qualquer linguagem, os comentários são utilizados para explicar o seu código, e podem ajudar quando se edita o código numa data posterior. Um comentário será ignorado pelos browsers, e em CSS começa com "/*" e termina com "*/", como este: / * Este é um comentário * / p { text-align: center; / * Este é outro comentário * / color: black; font-family: Arial Cor do primeiro plano: a propriedade 'color' Cores e fundos A propriedade color define a cor do primeiro plano de um elemento. Considere, por exemplo, que desejamos que todos os cabeçalhos de primeiro nível no documento sejam na cor vermelha. O elemento HTML que marca tais cabeçalhos é o elemento <h1>. O código a seguir define todos os <h1> na cor vermelha. h1 {color: #ff0000; Pág 3
4 A propriedade 'background-color' A propriedade background-color define a cor do fundo de um elemento. O elemento <body> contém todo o conteúdo de um documento HTML. Assim, para mudar a cor de fundo da página, devemos aplicar a propriedade background-color ao elemento <body>. Pode-se aplicar cores de fundo para outros elementos, inclusive para cabeçalhos e textos. No exemplo abaixo foram aplicadas diferentes cores de fundo para os elementos <body> e <h1>. body {background-color: #FFCC66; h1 {color: #990000; background-color: #FC9804; Images de fundo [background-image] A propriedade CSS background-image é usada para definir uma imagem de fundo. Para inserir uma imagem de fundo na página basta aplicar a propriedade background-image ao elemento <body> e especificar o caminho para onde está gravada a imagem. body { background-color: #FFCC66; background-image: url("butterfly.gif"); h1 { color: #990000; background-color: #FC9804; Notar como foi especificado o caminho para a imagem usando url("butterfly.gif"). Isto significa que a imagem está localizada no mesmo diretório da folha de estilos. Pode ser escolhido um outro diretório para gravar as imagens e o caminho seria url("../images/butterfly.gif") ou até mesmo hospedá-la na Internet: url(" Pág 4
5 Família de fontes [font-family] 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 do utilizador, deverá ser usada a segunda e assim por diante até ser encontrada uma fonte instalada. Existem dois tipos de nomes para definir fontes: nomes para famílias de fontes e nomes para famílias genéricas. nome para famílias de fontes: Exemplos para este tipo (normalmente conhecidas como "font") são "Arial", "Times New Roman" ou "Tahoma". nome para famílias genéricas: Famílias genéricas são fontes que pertencem a um grupo com aparência uniforme. Um exemplo são as fontes sans-serif que englobam a coleção de fontes que "não têm serifas". Exemplo de listagem de fontes: h1 {font-family: arial, verdana, sans-serif; h2 {font-family: "Times New Roman", serif; Estilo da fonte [font-style] A propriedade font-style define a escolha da fonte em normal, italic ou oblique. No exemplo a seguir todos as cabeçalhos <h2> serão em itálico. h1 {font-family: arial, verdana, sans-serif; h2 {font-family: "Times New Roman", serif; font-style: italic; Fonte variante [font-variant] A propriedade font-variant é usada para escolher as variantes normal ou small-caps. Uma fonte small-caps é aquela que usa letras maiúsculas de tamanhos reduzidos. Se a propriedade font-variant for definida para small-caps e não estiver disponível na máquina do utilizador, será usada fonte em maiúscula. h1 {font-variant: small-caps; h2 {font-variant: normal; Peso da fonte [font-weight] A propriedade font-weight define quão negrito ou "pesada" deve ser renderizada a fonte. Uma fonte pode ser normal ou bold. Alguns navegadores suportam números de (em intervalos de 100 em 100) para definir o peso da fonte. p {font-family: arial, verdana, sans-serif; td {font-family: arial, verdana, sans-serif; font-weight: bold; Pág 5
6 Tamanho da fonte [font-size] On tamanho da fonte é definido pela propriedade font-size. Existem muitas unidades (p. ex.:. pixels e percentagens) que podem ser usadas para definir o tamanho da fonte. Exemplos a seguir: h1 {font-size: 30px; h2 {font-size: 12pt; h3 {font-size: 120%; p {font-size: 1em; Alinhamento de textos [text-align] A propriedade text-align corresponde ao atributo align das antigas versões do HTML. Textos podem ser alinhados à esquerda (left), à direita (right) ou centrados (centred). E temos ainda o valor justify que faz com o texto contido em uma linha se estenda tocando as margens esquerda e direita. Este tipo de alinhamento é usado em jornais e revistas. No exemplo a seguir o texto contido na célula de cabeçalho <th> é alinhado à direita e os contidos nas células de dados <td> são centrados. E, os textos normais em parágrafos são justificados: th {text-align: right; td {text-align: center; p {text-align: justify; Decoração de textos [text-decoration] A propriedade text-decoration possibilita adicionar "efeitos" ou "decoração" em textos. Pode-se por exemplo, sublinhar textos, cortar o texto com uma linha, colocar uma linha sobre o texto, etc. No exemplo a seguir os cabeçalhos <h1> são sublinhados, os cabeçalhos <h2> levam um linha em cima e os cabeçalhos <h3> são cortados por uma linha. h1 {text-decoration: underline; h2 {text-decoration: overline; h3 {text-decoration: line-through; Pseudo-classe Uma pseudo-classe permite estilizar levando em conta condições diferentes ou eventos ao definir uma propriedade de estilo para uma tag HTML. Os links são marcados no HTML com tags <a>. Pode-se então usar a como um seletor CSS: a {color: blue; Pág 6
7 Um link pode ter diferentes estados. Por exemplo, pode ter sido visitado ou não visitado. Utilizamse pseudo-classes para estilizar links visitados e não visitados. a:link {color: blue; a:visited { color: red; Links ativos são estilizados com a pseudo-classe a:active e a:hover, esta última é a pseudo-classe para links com o ponteiro do mouse sobre ele. Pseudo-classe: link A pseudo-classe: link é usada para links não visitados. No exemplo a seguir links não vistados serão na cor verde. a:link {color: green; Pseudo-classe: visited A pseudo-classe :visited é usada para links visitados. a:visited { color: yellow; Pseudo-classe: active A pseudo-classe :active é usada para links ativos. No exemplo a seguir links ativos terão seu fundo na cor vermelha: a:active { background-color: red; Pseudo-classe: hover A pseudo-classe :hover é usada para quando o ponteiro do mouse está sobre o link. Isto pode ser usado para conseguir efeitos bem interessantes. Por exemplo, podemos mudar a cor do link para laranja e o texto para itálico quando o ponteiro do mouse passa sobre ele, o código CSS para estes efeitos é o mostrado a seguir: a:hover { color: orange; font-style: italic; Exemplo completo: a:link {color: blue a:visited {color: purple a:active {background-color: yellow a:hover {color:red Pág 7
8 Definindo margin de um elemento Um elemento tem quatro lados: right, left, top e bottom (direito, esquerdo, superior e inferior). A margin é a distância entre os lados de elementos vizinhos (ou às bordas do documento). Vamos começar com um exemplo mostrando como definir margins para o documento, ou seja, para o elemento <body>. A ilustração a seguir mostra como serão as margens da página. As CSS são mostradas abaixo: body { margin-top: 100px; margin-right: 40px; margin-bottom: 10px; margin-left: 70px; Ou: body { margin: 100px 40px 10px 70px; Pág 8
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
Web Design Aula 15: Propriedades CSS
Web Design Aula 15: Propriedades CSS Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Roteiro Propriedades de texto Propriedades de Cores Propriedades de Bordas Propriedades de Listas Cor de
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
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
CSS Cascading Style Sheets Folhas de Estilo em Cascata
CSS Cascading Style Sheets Folhas de Estilo em Cascata Conjunto de instruções que controla a aparência de uma página Web 1. Regra CSS seletor { propriedade1: valor; propriedade2: valor; 2. Aplicação 2.1
TECNOLOGIAS WEB AULA 9 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD
TECNOLOGIAS WEB AULA 9 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD Objetivos: Compreender a sintaxe utilizada em Folhas de Estilos em Cascata, seu uso e limitações. Apresentar as principais características das
FOLHAS DE ESTILO EM CASCATA
FOLHAS DE ESTILO EM CASCATA CSS (Cascading Style Sheets) ou Folhas de Estilo em Cascata são um conjunto de regras de estilo que definem como os elementos e os tags em uma página HTML devem ser exibidos
Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens
Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens Tag para inserir imagens e HTML O modelo CSS Noções fundamentais e funcionamento do CSS Incluindo estilos em uma página Sintaxe
CSS. Sérgio Nunes. Comunicações Digitais e Internet Ciências da Comunicação, U.Porto 2012/13
CSS Sérgio Nunes Comunicações Digitais e Internet Ciências da Comunicação, U.Porto 2012/13 1 Objetivos Conhecer as origens e os objetivos da linguagem CSS. Conhecer a estrutura base de uma regra CSS. Compreender
Introdução à Cascading Style Sheets
Estilo e Produtividade para Websites OVERVIEW História e Significado Por que usar? Como usar? Orientações ao Desenvolvedor O que é CSS? O que é CSS? Cascading Style sheets" ou "Folhas de Estilo Encadeadas
Roteiro de Auxílio para as Atividades Práticas de Sistemas de Informação
Roteiro de Auxílio para as Atividades Práticas de Sistemas de Informação A linguagem XML no contexto do curso de Sistemas de Informação é utilizada principalmente para o armazenamento e a manipulação de
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.
APOSTILA DE PROGRAMAÇÃO WEB
Programação Web - CSS 1 PROFESSOR LUIS NÍCOLAS DE AMORIM TRIGO APOSTILA DE PROGRAMAÇÃO WEB CSS CASCADING STYLE SHEETS (FOLHAS DE ESTILO EM CASCATA) Programação Web - CSS 2 INTRODUÇÃO CSS, também conhecido
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
Programação para Web HTML - Parte 2
Programação para Web HTML - Parte 2 Professor: Harlley Lima E-mail: harlley@decom.cefetmg.br Departamento de Computação Centro Federal de Educação Tecnológica de Minas Gerais Belo Horizonte, 2 de março
1) Criar o código HTML para construir a página representada pela imagem abaixo.
1) Criar o código HTML para construir a página representada pela imagem abaixo. 2) Código HTML puro (criar arquivo index.html): brasil Motores Motores diesel para uso automotivo, veicular, marítimo,
Compêndio códigos. {css}
Compêndio códigos {css} ADVERTÊNCIA: A que se segue é apenas uma lista com as propriedades de CSS, não pretende de modo algum ser um manual. Pressupõe, portanto, que já se saiba de antemão o signi cado
HTML. (Hypertext Markup Language Linguagem de Marcação de Hipertexto)
HTML (Hypertext Markup Language Linguagem de Marcação de Hipertexto) CSS - Cascading Style Sheets CSS serve para definir propriedades de apresentação/formatação a aplicar em tags HTML. A sua utilização
CSS Luciano Otávio de Assis CSS
CSS O HTML tem suas limitações quando se tratar de se construir layout. É certo, você tem seis diferentes tipos s títulos e de 6 diferentes tamanhos de fontes. Quando você trabalha com tabelas, você tem
Roteiro de Estudos e Atividades Avaliativas HTML
Roteiro de Estudos e Atividades Avaliativas HTML Faça essa atividade de forma individual ou em dupla, faça o máximo de questões que conseguir. Pesquise na Web o significado das tags e utilize-as para alcançar
Cadeira de Tecnologias de Informação. Ano lectivo 2009/2010. Sites dinâmicos. Com Expression Web TI2009/10 EWD_1. Filipa Pires da Silva (2009)
Cadeira de Tecnologias de Informação Ano lectivo 2009/2010 Sites dinâmicos Com Expression Web TI2009/10 EWD_1 .ASPX vs.html HTML: HTML é uma linguagem para descrever páginas web HTML significa Hyper Text
gedit Bloco de notas
GOVERNO DA REPÚBLICA PORTUGUESA gedit Bloco de notas Sistema Operativo Linux Tecnologias de Informação e Comunicação Professor: Joaquim Frias Instruções básicas do HTML TAGS TAGS Uma tag é uma instrução
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
Apostila CSS - Introdução à folha de estilos
Apostila CSS - Introdução à folha de estilos Este documento é propriedade intelectual do Núcleo de Educação a distância da NRsystem e distribuído sob os seguintes termos: 1. As apostilas publicadas pelo
Aula 5 Cabeçalhos, Imagens e Links
Roteiro Aula 5 Cabeçalhos, Imagens e Links Efeitos em cabeçalhos Imagens e CSS Links Curso: Técnico em Informática / 2º Módulo Disciplina: Desenvolvimento Web Professora: Luciana Balieiro Cosme Efeitos
MANUAL DE NORMAS GRÁFICAS MOD02_PR02_V01
MANUAL DE NORMAS GRÁFICAS 1 MOD02_PR02_V01 DATA: Novembro 2015 ELABORADO: Laura Santos APROVADO: Manuel Serejo ASSUNTO: Normas para apresentação de documentos Normas e apresentação dos documentos (word,
Técnicas e processos de produção. Profº Ritielle Souza
Técnicas e processos de produção Profº Ritielle Souza Ferramentas Programáveis Mensagem para mais de um destinatário FALE CONOSCO Definindo
css Cascading Style Sheets CSS CASCADING STYLE SHEETS
css Cascading Style Sheets CSS CASCADING STYLE SHEETS Oque é o CSS Cascading Style Sheets - Folhas de Estilo em Cascata Não é uma linguagem de programação, é uma linguagem de estilo. Define a apresentação
FORMAÇÃO WORDPRESS. Desenvolvimento de sites com a plataforma Wordpress. Abel Soares abelbarbosasoares@gmail.com
FORMAÇÃO Desenvolvimento de sites com a plataforma Wordpress Abel Soares abelbarbosasoares@gmail.com O QUE É O Sistema de gestão de conteúdos que lhe permite criar e manter, de maneira simples e robusta,
Manual de Identidade Visual
Manual de Identidade Visual APRESENTAÇÃO Este Manual tem como objetivo estabelecer e consolidar a identidade visual da Secretaria do Tesouro Nacional, garantindo a unicidade no processo comunicativo em
Relatório do GPES Relatório referente ao estudo sobre a Linguagem HTML e CSS. Realizado do dia 19 de Abril de 2011 a 02 de Maio de 2011.
Relatório do GPES Relatório referente ao estudo sobre a Linguagem HTML e CSS. Realizado do dia 19 de Abril de 2011 a 02 de Maio de 2011. CSS aplicado com HTML CSS é a sigla para Cascading Style Sheets
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
CSS -Cascading Style Sheets - Introdução
CSS -Cascading Style Sheets - Introdução Como surgiu a tecnologia CSS? De início, a linguagem HTML foi criada para a construção de páginas Web, que exibiam apenas documentos científicos. Com a evolução
Cascading Style Sheets
Cascading Style Sheets António Gonçalves ESTSetúbal ÍNDICE Introdução Sintaxe Básica Regras Selectores Selectores Contextuais Propriedades Valores Agrupamento Herança Comentários Pseudo-classes e Pseudo-elementos
Unidade: O que é CSS? HTML e CSS? Boa aula!!!
Unidade: O que é CSS? HTML e CSS? Boa aula!!! Objetivo Construir: Padrões Web, Tableless e outros Como inserir o CSS nas páginas Sintaxe de utilização do CSS Tag DIV e tag SPAN Orientações Durante a explanação
CSS - Parte 02. Prof. Marciano dos Santos Dionizio
CSS - Parte 02 Prof. Marciano dos Santos Dionizio Imagens de fundo [backgroundimage] A propriedade CSS background-image é usada para definir uma imagem de fundo. Usaremos a imagem de uma borboleta para
HTML. Um documento HTML é constituído por um conjunto de TAGS (ex. html, head, body, etc.).
HTML Um documento HTML é constituído por um conjunto de TAGS (ex. html, head, body, etc.). Para se criar um novo documento HTML pode-se utilizar o Bloco de Notas, bastando para tal gravar o documento com
C A P I T U L O 0 1 I N T R O D U Ç Ã O XHTML
C A P I T U L O 0 1 I N T R O D U Ç Ã O A O XHTML 1 O QUE É XHTML? XHTML significa Linguagem de Marcação de Hipertexto (Extensible Hypertext Markup Language) XHTML é quase idêntico ao HTML 4.01 XHTML é
#Aula Nº 3 Estilo CSS webstandards.samus.com.br webstandards.samus.com.br/aulas/aula3.pdf Vinicius Fiorio Custódio samus@samus.com.
#Aula Nº 3 Estilo CSS webstandards.samus.com.br webstandards.samus.com.br/aulas/aula3.pdf Vinicius Fiorio Custódio samus@samus.com.br #Objetivo Apresentar os conceitos de utilização do CSS, Sintaxe, Seletores
CSS - Cascading Style Sheets
Introdução CSS - Cascading Style Sheets Padrão de Apresentação de Documentos CSS Cascate Style Sheets Objetivos: Conhecer o Histórico; Conhecer a Usabilidade; Por que usar? Quando usar? Como usar? Conhecer
Programação e Designer para WEB
Programação e Designer para WEB html Prof. Rodrigo Rocha prof.rodrigorocha@yahoo.com http://www.bolinhabolinha.com Apresentação Onde Estamos Introdução a hipertexto. A linguagem. Ambientes para programação
BIBLIOGRAFIA:... 36. CSS pode ser adicionado com uso do atributo style. Por exemplo, você pode definir o tipo e o tamanho da fonte em um parágrafo:
Css Página 1 CSS Sumário Introdução ao CSS... 4 O que mais posso fazer com CSS?... 6 Como funciona as CSS... 7 Método 1: In-line (o atributo style)... 8 Método 2: Interno (a tag style)... 8 Método 3: Externo
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
Tecnologias para Web Design
Tecnologias para Web Design CSS Folhas de estilo em cascata ÿ CSS Cascading Style Sheets ÿ Linguagem para definir atributos de estilo dos elementos da linguagem HTML ÿ CSS é uma linguagem independente
Cadeira de Tecnologias de Informação. Ano lectivo 2009/2010. Sites dinâmicos. Com Expression Web (Parte 2) TI2009/10 EWD_1
Cadeira de Tecnologias de Informação Ano lectivo 2009/2010 Sites dinâmicos Com Expression Web (Parte 2) TI2009/10 EWD_1 Como fazer um Insert (1) Antes de aprendermos a fazer um Insert vamos alterar a página
Autoria Web. Professor: Diego Oliveira. Conteúdo 02: Principais Tags HTML
Autoria Web Professor: Diego Oliveira Conteúdo 02: Principais Tags HTML Diferença de HTML e XHTML Os elementos XHTML devem estar devidamente aninhados Os documentos XHTML devem estar bem-formados Os nomes
apostila DE html, xhtml e css
apostila DE html, xhtml e css Índice HTML 1.Introdução ao HTML página 04 2.O que é o HTML página 05 3.O que são tags HTML página 05 4.Iniciando com HTML página 10 5.Mais tags HTML página 12 6.Atributos
Internet e Programação Web
COLÉGIO ESTADUAL PEDRO MACEDO Ensino Profissionalizante Internet e Programação Web 2 Técnico Prof. Cesar 2014 1 1. CSS CSS é uma linguagem para estilos que define o layout de documentos HTML. Por exemplo,
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
Ferramentas Programáveis. Profº Ritielle Souza
Ferramentas Programáveis Profº Ritielle Souza Folhas de Estilo Existem três formas de trabalharmos com folhas de estilos Forma mais usual CSS Externo Estilo na página Forma menos usual estilo inline
TUTORIAL CSS PRIMEIROS PASSOS COM HTML + CSS
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: http://www.w3.org/style/examples/011/firstcss
CSS ETEC FRANCISCO MORATO. Professores: Kelly e Rafael
CSS ETEC FRANCISCO MORATO Professores: Kelly e Rafael 2015 Agenda Introdução; Website Layouts; CSS; Referências. 2 Website Layouts A maioria dos sites têm colocado o seu conteúdo em várias colunas; Ex.:
Capítulo 9 - Imagens. Imagens
Capítulo 9 - Imagens 9 Imagens EM JAVASCRIPT, É POSSÍVEL MANIPULAR COM AS IMAGENS DE UMA PÁGINA, alterando a URL que localiza o arquivo de imagem. Assim, pode-se trocar a imagem que está sendo exibida
ÁREA DO PROFESSOR (TUTOR)
ÁREA DO PROFESSOR (TUTOR) O MOODLE (Modular Object Oriented Dynamic Learning Environment) é um Ambiente Virtual de Ensino-Aprendizagem (AVEA) de código aberto, livre e gratuito que se mantém em desenvolvimento
PROCEDIMENTOS PARA INCLUSÃO DE PERIÓDICOS NO PORTAL DE PERIÓDICOS FCLAR UNESP
PROCEDIMENTOS PARA INCLUSÃO DE PERIÓDICOS NO PORTAL DE PERIÓDICOS FCLAR UNESP Os editores interessados em incluir sua revista no Portal de Periódicos FCLAr UNESP, devem apresentar um breve projeto, em
Programação WEB. Prof. André Gustavo Duarte de Almeida andre.almeida@ifrn.edu.br www3.ifrn.edu.br/~andrealmeida. Aula II jquery UI
Prof. André Gustavo Duarte de Almeida andre.almeida@ifrn.edu.br www3.ifrn.edu.br/~andrealmeida Aula II jquery UI Introdução O que é jquery UI? Biblioteca que fornece maior nível de abstração para interação
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
Computação na Internet HTML&CSS - Exercícios. Dicas para criação de conteúdos em HTML
Dicas para criação de conteúdos em HTML Apresentam-se de seguida algumas dicas para autores de conteúdos em HTML. Ao utilizar estas dicas, a manutenção das páginas ficará facilitada, ficarão mais apresentáveis
Gestão Documental. Gestão Documental
Alcides Marques, 2007 Actualizado por Ricardo Matos em Junho de 2009 Neste capítulo pretende-se analisar a temática da, começando por apresentar um breve resumo dos conceitos subjacentes e apresentando
neste tutorial, iremos abordar as folhas de estilo em cascata, mais conhecidas como cascading style sheets. por que usar css?
neste tutorial, iremos abordar as folhas de estilo em cascata, mais conhecidas como cascading style sheets. por que usar css? O html inclui uma tag para praticamente todos os elementos de design comumente
APOSTILA DE INFORMÁTICA WORD PAD E TECLADO
APOSTILA DE INFORMÁTICA WORD PAD E TECLADO Profa Responsável Fabiana P. Masson Caravieri Colaboração das monitoras: Cindy Berti e Laysla Araujo Giovanini SUMÁRIO 1. EDITOR DE TEXTO... 3 1.1. WORDPAD...
a) O Word é um editor de TEXTOS. Com ele é possível digitar cartas, currículos e trabalhos escolares.
START - WORD Respostas dos Exercícios CAPÍ TULO 1 1. Complete as frases usando as palavras do quadro: JANELA TEXTOS TÍTULO ZOOM a) O Word é um editor de TEXTOS. Com ele é possível digitar cartas, currículos
MODELO SUGERIDO PARA PROJETO DE PESQUISA
MODELO SUGERIDO PARA PROJETO DE PESQUISA MODELO PARA ELABORAÇÃO DE PROJETO DE PESQUISA (Hospital Regional do Mato Grosso do Sul- HRMS) Campo Grande MS MÊS /ANO TÍTULO/SUBTÍTULO DO PROJETO NOME DO (s) ALUNO
HyperText Markup Language HTML
HyperText Markup Language HTML Prof. Luis Nícolas de Amorim Trigo nicolas.trigo@ifsertao-pe.edu.br http://professor.ifsertao-pe.edu.br/nicolas.trigo/ Introdução Linguagem de Marcação de Hipertexto. Uma
Capítulo 1. Importação de Dados de Instituições Financeiras - Arquivo TXT 3
Sumário Capítulo 1. Importação de Dados de Instituições Financeiras - Arquivo TXT 3 Capítulo 2. Importação de Dados de Instituições Financeiras - Arquivo XML 12 Capítulo 1. Importação de Dados de Instituições
Apostila de Introdução ao CSS
Universidade Federal Fluminense Centro Tecnológico Escola de Engenharia Curso de Engenharia de Telecomunicações Programa de Educação Tutorial Grupo PET-Tele Apostila de Introdução ao CSS Autor atual: Isabelle
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
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,
Módulo de Aprendizagem I
Módulo de Aprendizagem I Digitalizar fotografias para a base de dados do SiFEUP Notas: No decorrer deste módulo de aprendizagem, pressupõe-se que o utilizador já tem o scanner devidamente instalado no
2 Segmentação de imagens e Componentes conexas
Universidade Tecnológica Federal do Paraná (UTFPR) Departamento Acadêmico de Informática (DAINF) Algoritmos II Professor: Alex Kutzke (alexk@dainf.ct.utfpr.edu.br) Especificação do Primeiro Trabalho Prático
REITORA Ulrika Arns. VICE-REITOR Almir Barros da Silva Santos Neto. DIRETOR DO NTIC Leonardo Bidese de Pinho
2014 Núcleo de Tecnologia da Informação e Comunicação - NTIC 17/01/2014 REITORA Ulrika Arns VICE-REITOR Almir Barros da Silva Santos Neto DIRETOR DO NTIC Leonardo Bidese de Pinho COORDENADOR DE DESENVOLVIMENTO
Folha Prática Nº5 CSS. UNIVERSIDADE DA BEIRA INTERIOR Faculdade de Engenharia Departamento de Informática. Tecnologias Internet - 2011/2012
Folha Prática Nº CSS / Filipe Quinaz . Folhas de Estilo 0 Internas, delimitadas pela marca style h, h font-family: sans-serif; color: #CC;
Cabeçalho do documento
Cabeçalho do documento O cabeçalho de uma página HTML fica dentro das Tags e , e dentro dessas Tags podemos usar Tags , , , , e etc. A Tag TITLE Por exemplo
4 - HTML Básico: 4.2 - Criando documentos HTML:
4 - HTML Básico: 4.1 - O que é HTML? Os documentos na Web são organizados com o uso de comandos que são interpretados pelos browsers. Estes comandos compõem a linguagem HTML (HyperText Markup Language).
NOVA VERSÃO SAFE DOC MANUAL
NOVA VERSÃO SAFE DOC MANUAL COMO ACESSAR O APLICATIVO SAFE DOC CAPTURE Acesse o aplicativo SAFE-DOC CAPTURE clicando no ícone na sua área de trabalho: SAFE-DOC Capture Digite o endereço do portal que é
GUIA PARA O PREENCHIMENTO DOS FORMULÁRIOS ENTIDADE GESTORA SOCIEDADE PONTO VERDE
GUIA PARA O PREENCHIMENTO DOS FORMULÁRIOS ENTIDADE GESTORA SOCIEDADE PONTO VERDE Versão: 1.0 Data: 05-06-2009 Índice Acesso e estados dos Formulários... 3 Escolha do Formulário e submissão... 4 Bases para
Manual do Usuário Sistema de Acuidade Visual Digital
Manual do Usuário Sistema de Acuidade Visual Digital Página 1 de 16 Índice DonD - Sistema para Teste de Acuidade Visual...3 Componentes do Produto...4 Instalação...5 Abrindo o sistema do DonD...5 Configuração...6
Para acessar o NVU clique em Iniciar >> Programas >> Editor de Internet, iniciando aparecerá a seguinte tela:
1 APOSTILA NVU Cobra Tecnologia, www.cobra.com.br Última revisão em 12 de Julho de 2005 DESCRIÇÃO: O NVU é uma ferramenta que foi criada para web designers e para desenvolvedores de aplicações para o ambiente
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,
Produção de documentos acessíveis com Microsoft Word. Gabinete para a Inclusão (GPI)
Produção de documentos acessíveis com Microsoft Word Gabinete para a Inclusão (GPI) 2013 Produção de documentos acessíveis com Microsoft Word Com este tutorial pretendemos orientá-lo na produção de documentos
Atividade de Treinamento. Documentando Programas no SPDSW. HI Tecnologia Indústria e Comércio Ltda. Documento de acesso Público
Atividade de Treinamento HI Tecnologia Indústria e Comércio Ltda. Documento de acesso Público EAT.01005 Versão 1.0 24 de Novembro de 2014 Atividade de Treinamento Ref: EAT.01005 Rev: 1 Arquivo: EAT0100500.odt
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
Elementos HTML. O parágrafo pode ter seu alinhamento alterado, se usar o parâmetro ALIGN.
Elementos HTML Parágrafos e Quebras de Linha A linguagem HTML não reconhece as quebras de linha geradas pelo uso da tecla e os espaços (no caso mais de um) incluídos por meio do teclado. Comando...
Manual do Usuário CMS WordPress MU Versão atual: 2.8
Manual do Usuário CMS WordPress MU Versão atual: 2.8 1 - Introdução O Centro de Gestão do Conhecimento Organizacional, CGCO, criou, há um ano, uma equipe para atender à demanda de criação de novos sites
4. Características Gerais das Tabelas do HTML
4. Características Gerais das Tabelas do HTML Curso de Extensão em HTML PUCRS A criação de uma tabela começa pelo tag e termina pelo tag. Antes do texto de cada linha da tabela você deve inserir o tag
PLANIFICAÇÃO INTRODUÇÃO ÀS TECNOLOGIAS DE INFORMAÇÃO BLOCO I
PLANIFICAÇÃO INTRODUÇÃO ÀS TECNOLOGIAS DE INFORMAÇÃO BLOCO I MÉDIO PRAZO 1 TECNOLOGIAS DE INFORMAÇÃO E INFORMÁTICA OBJECTIVOS CONTEÚDOS DATA Conceitos Introdutórios Conhecer os conceitos básicos relacionados
aplicação arquivo Condições Gerais de Utilização
aplicação arquivo Condições Gerais de Utilização Manual das condições gerais que regulam a utilização dos serviços disponibilizados pela aplicação Arquivo, plataforma de gestão de informação, do Municipio
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
LOGO DO WEBSITE DA FUTURA APP
LOGO DO WEBSITE DA FUTURA APP LexiZi é uma aplicação mobile e web que é simultaneamente uma ferramenta e um serviço. a) Ferramenta É uma ferramenta porque permite a criação de Notas em cada um dos artigos
Prof. Vania Gimenez- Aula de Hoje Caro aluno- Este material é só um apoio as aulas, os livros devem ser utilizados para o aprimoramento de seu estudo.
Prof. Vania Gimenez- Aula de Hoje Caro aluno- Este material é só um apoio as aulas, os livros devem ser utilizados para o aprimoramento de seu estudo. Como defino e escrevo uma classe? Classe é um seletor
Exercício 1. 1-Inicialize o Microsoft Word. Clique no botão iniciar menu programas e submenu Microsoft Word.
Exercício 1 1-Inicialize o Microsoft Word. Clique no botão iniciar menu programas e submenu Microsoft Word. 2-Digite o seguinte texto. Este ficheiro Leia-me indica ao utilizador onde deve localizar informações
A Web, o Design, o Software Livre e outras histórias... Eduardo Santos - www.agni.art.br
A Web, o Design, o Software Livre e outras histórias... Eduardo Santos - www.agni.art.br Surgimento da WEB e HTML Início da década de 90 HTML (acrônimo para a expressão HyperText Markup Language, que significa
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
PLANO DE AULA. OBJETIVO: Conhecer os programas para editar textos: WordPad e Microsoft Office Word 2007.
PLANO DE AULA DATA: CARGA HORÁRIA: 2h PROFESSOR: Ivan de Jesus Ribeiro OBJETIVO: Conhecer os programas para editar textos: WordPad e Microsoft Office Word 2007. METODOLOGIA DE ENSINO: Dialogada, Expositiva
APOSTILA DE INFORMÁTICA INTERNET E E-MAIL
APOSTILA DE INFORMÁTICA INTERNET E E-MAIL Profa Responsável Fabiana P. Masson Caravieri Colaboração Empresa Júnior da Fatec Jales Monitora: Ângela Lopes Manente SUMÁRIO 1. INTERNET... 3 2. ACESSANDO A
www.sysdevsolutions.com Driver Next Versão 1.0 de 07-03-2011 Português
Driver Next Versão 1.0 de 07-03-2011 Português Índice Configuração dos documentos no Backofficce... 3 O Driver ERP Next... 6 Configurações principais... 6 Configurações do vendedor... 7 Configurações do
<!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
Módulo e-rede Magento v1.0. Manual de. Instalação do Módulo. estamos todos ligados
Módulo e-rede Magento v1.0 Manual de Instalação do Módulo estamos todos ligados 01 02 03 04 Introdução 3 Versão 3 Requerimentos 3 Manual de instalação 4 05 06 4.1 Instruções iniciais 4 4.2 Instalação e