O documento descreve propriedades CSS relacionadas a bordas, margens, preenchimento, cores, fontes e texto. Ele lista propriedades individuais para formatar cada lado separadamente e atalhos para formatar múltiplos lados de uma vez. Propriedades como cor, estilo e largura de borda podem ser definidas para cada lado ou para todos os lados simultaneamente.
Este documento apresenta os principais atributos HTML e como formatar documentos HTML utilizando estilos. Ele discute atributos como title, href, src, width, height, alt, style, color, font-size e outros. Além disso, fornece exemplos de como aplicar esses atributos e estilos para formatar elementos como parágrafos, imagens, links e textos.
O documento descreve como usar CSS (Cascading Style Sheets) para criar estilos para sites. CSS permite separar o conteúdo da formatação, tornando mais fácil manter e atualizar a aparência de um site. Exemplos de código CSS demonstram como definir estilos para elementos como fontes, cores, layouts e navegação.
O Dropbox é um serviço gratuito que permite armazenar e sincronizar arquivos entre dispositivos. Os arquivos salvos na pasta Dropbox são automaticamente atualizados em todos os computadores e celulares do usuário, permitindo acessar e editar os arquivos de qualquer lugar. O Dropbox oferece opções de compartilhamento e acesso aos arquivos pelo site.
1) O documento descreve uma proposta de inovação no ensino de anatomia humana utilizando os princípios da teoria da aprendizagem significativa;
2) Foi realizado um diagnóstico identificando problemas como conteúdo extenso, falta de integração com os cursos, dificuldades dos alunos em laboratório;
3) Foram elaboradas estratégias visando uma aprendizagem mais significativa, como dinâmicas em laboratório para melhor identificação de estruturas.
O documento discute vários tópicos relacionados a problemas sociais como fome, migração, intolerância, apartheid e globalização. Ele também lista alguns alunos que estudam esses temas.
Este documento contiene dos listas de pendencias de estudiantes de dos carreras. La primera lista es de estudiantes de Matemática y enumera los documentos que faltan de seis estudiantes como historia de enseñanza media u originales de boletos. La segunda lista es de estudiantes de Letras y enumera los documentos que faltan de catorce estudiantes como historia de enseñanza media u originales o datos adicionales en documentos.
Montage es una herramienta en línea que permite crear publicaciones digitales tipo álbum o periódico. Los usuarios pueden agregar contenido como imágenes, videos, noticias y texto personalizado a diferentes paneles y secciones. La información se puede extraer de fuentes como RSS, Twitter y Bing. Una vez creado, el montaje se puede publicar y compartir en línea con un enlace.
Este documento presenta información sobre las teorías críticas e interaccionismo simbólico. Explica que la teoría crítica se origina en la Escuela de Frankfurt y rechaza la realidad sociohistórica presente por considerarla injusta e irracional. También describe los principios del interaccionismo simbólico, como que la sociedad se entiende a través de la comunicación y que los individuos se desarrollan socialmente a través de la interacción y los símbolos. Finalmente, resalta la importancia de la interacci
Este documento apresenta os principais atributos HTML e como formatar documentos HTML utilizando estilos. Ele discute atributos como title, href, src, width, height, alt, style, color, font-size e outros. Além disso, fornece exemplos de como aplicar esses atributos e estilos para formatar elementos como parágrafos, imagens, links e textos.
O documento descreve como usar CSS (Cascading Style Sheets) para criar estilos para sites. CSS permite separar o conteúdo da formatação, tornando mais fácil manter e atualizar a aparência de um site. Exemplos de código CSS demonstram como definir estilos para elementos como fontes, cores, layouts e navegação.
O Dropbox é um serviço gratuito que permite armazenar e sincronizar arquivos entre dispositivos. Os arquivos salvos na pasta Dropbox são automaticamente atualizados em todos os computadores e celulares do usuário, permitindo acessar e editar os arquivos de qualquer lugar. O Dropbox oferece opções de compartilhamento e acesso aos arquivos pelo site.
1) O documento descreve uma proposta de inovação no ensino de anatomia humana utilizando os princípios da teoria da aprendizagem significativa;
2) Foi realizado um diagnóstico identificando problemas como conteúdo extenso, falta de integração com os cursos, dificuldades dos alunos em laboratório;
3) Foram elaboradas estratégias visando uma aprendizagem mais significativa, como dinâmicas em laboratório para melhor identificação de estruturas.
O documento discute vários tópicos relacionados a problemas sociais como fome, migração, intolerância, apartheid e globalização. Ele também lista alguns alunos que estudam esses temas.
Este documento contiene dos listas de pendencias de estudiantes de dos carreras. La primera lista es de estudiantes de Matemática y enumera los documentos que faltan de seis estudiantes como historia de enseñanza media u originales de boletos. La segunda lista es de estudiantes de Letras y enumera los documentos que faltan de catorce estudiantes como historia de enseñanza media u originales o datos adicionales en documentos.
Montage es una herramienta en línea que permite crear publicaciones digitales tipo álbum o periódico. Los usuarios pueden agregar contenido como imágenes, videos, noticias y texto personalizado a diferentes paneles y secciones. La información se puede extraer de fuentes como RSS, Twitter y Bing. Una vez creado, el montaje se puede publicar y compartir en línea con un enlace.
Este documento presenta información sobre las teorías críticas e interaccionismo simbólico. Explica que la teoría crítica se origina en la Escuela de Frankfurt y rechaza la realidad sociohistórica presente por considerarla injusta e irracional. También describe los principios del interaccionismo simbólico, como que la sociedad se entiende a través de la comunicación y que los individuos se desarrollan socialmente a través de la interacción y los símbolos. Finalmente, resalta la importancia de la interacci
O documento compara a Norma 508 e as WCAG, legislações dos EUA e do W3C respectivamente sobre acessibilidade digital. A Norma 508 exige que tecnologias do governo americano sejam acessíveis, enquanto as WCAG fornecem recomendações para tornar sites acessíveis. Embora tratem do mesmo tema, a Norma 508 se aplica ao governo e as WCAG são diretrizes voluntárias para desenvolvedores web.
Noções sobre os quatro princípios de acessibilidadediogolevel3
O documento descreve os quatro princípios de acessibilidade da web: perceptível, operável, compreensível e robusto. Ele explica que os conteúdos da web devem ser apresentados de forma que todos os usuários possam percebê-los, operá-los, compreendê-los e acessá-los com diferentes tecnologias.
O documento discute o conceito de Design Universal, que visa criar produtos, serviços e ambientes que possam ser usados por um maior número de pessoas possível, independentemente de idade, habilidade ou situação. O Design Universal surgiu nos anos 1970 e está ligado à acessibilidade, usabilidade e navegabilidade. Ele significa "design que inclui" ao invés de excluir certos grupos.
A aula de acessibilidade na Web ensinou os alunos sobre como é navegar na internet com deficiência visual, tentando ler um site com os olhos vendados. Eles encontraram muita dificuldade e entenderam melhor a importância da acessibilidade para que todos possam usar websites de forma igual. A acessibilidade na Web refere-se à prática inclusiva de criar sites acessíveis a todas as pessoas, independentemente de deficiências.
Design responsivo é um design de páginas da web que se adapta automaticamente a diferentes tamanhos de tela como desktops, tablets e celulares para melhorar a visualização e navegação. O documento descreve três passos para criar um layout responsivo: 1) estruturar o HTML para três tamanhos de tela, 2) definir regras CSS com cores diferentes para cada tela, 3) exibir o resultado final com a formatação adequada para cada dispositivo.
O documento discute a importância da acessibilidade na web. Ele explica o que é acessibilidade e como garantir que sites e conteúdos online sejam acessíveis para todos os usuários, independentemente de deficiências. Isso inclui fazer com que imagens, formulários, fontes e cores sejam acessíveis através do uso correto de atributos HTML.
O documento discute técnicas de abreviação em CSS. Ele explica como propriedades como cor, fonte, margem e padding podem ser abreviadas usando seus valores padrão quando valores omitidos. Exemplos mostram como abreviar valores hexadecimais de cores e definir várias propriedades de fonte em uma única declaração.
O documento descreve os diferentes tipos de seletores CSS, como o seletor universal (*), seletores de tipo de elemento (e), seletores contextual (e f), seletores de elementos filho (e > f) e pseudo-classes como :hover e :active que permitem estilizar elementos em diferentes estados.
O documento explica os diferentes tipos de seletores CSS, incluindo seletores de tipo de elemento, contextual, filho, classe, ID, atributo e pseudo-classes que permitem estilizar partes específicas de um documento HTML.
O documento descreve as quatro camadas do modelo TCP/IP: camada de aplicação, camada de transporte, camada de internet e camada de link. A camada de aplicação suporta protocolos como FTP, SMTP e HTTP. A camada de transporte fornece comunicação ponto-a-ponto de forma confiável ou não confiável. A camada de internet roteia pacotes usando o protocolo IP. A camada de link se conecta à rede física.
O documento descreve as sete camadas do Modelo OSI, incluindo a Camada Física, a Camada de Enlace, a Camada de Rede, a Camada de Transporte, a Camada de Sessão, a Camada de Apresentação e a Camada de Aplicação.
O documento descreve as sete camadas do Modelo OSI, incluindo a Camada Física, a Camada de Enlace, a Camada de Rede, a Camada de Transporte, a Camada de Sessão, a Camada de Apresentação e a Camada de Aplicação.
O documento fornece instruções sobre como criar um CSS para impressão de páginas da web. Ele explica que é importante preparar um CSS separado para impressão para fornecer uma visualização adequada ao imprimir páginas. Ele então discute como criar um novo CSS para impressão ou usar o CSS existente como base, e como declarar o CSS para impressão usando a propriedade "media" para que ele só se aplique à impressão.
O documento discute três tópicos principais sobre CSS avançado: 1) Efeito cascata e como regras CSS conflitantes são resolvidas, 2) Especificidade e como a especificidade de uma regra determina qual regra é aplicada, 3) Diferença entre link e @import e como cada um é usado.
O documento fornece definições para várias abreviações comumente usadas em internet e tecnologia da informação, incluindo POST, COOKIE, DNS, URL, CPU, ASP, PHP, PYTHON e RUBY ON RAILS. AJAX é definido como o uso de tecnologias como Javascript e XML para tornar páginas da web mais interativas com solicitações assíncronas de informações.
O documento fornece definições para termos relacionados à internet e tecnologia, incluindo:
1) Cliente-servidor descreve um modelo onde clientes solicitam dados de servidores através de uma rede;
2) PC refere-se a um computador pessoal para uso individual;
3) Home office descreve trabalhar remotamente de casa.
O documento lista abreviações comumente usadas em internet e tecnologia da informação, incluindo NIC, CERT, HTTPS, WEP, HTML, HTML5, Streaming, Flash, Plugin e JavaScript. As abreviações explicam termos como Network Interface Controller, segurança na internet, protocolos de comunicação, linguagens de marcação, transmissão de mídia, programas de animação e linguagens de programação.
O documento descreve os principais protocolos da Internet, incluindo HTTP para transferência de páginas web, SMTP para envio de email, FTP para transferência de arquivos, e TCP e IP que fornecem a base para a comunicação entre dispositivos na Internet.
1) O documento apresenta definições abreviadas para termos técnicos relacionados a redes e programação da web, como HTTPS, HTML, JavaScript e Flash.
2) As definições descrevem o que cada sigla representa e sua função principal, como HTTPS fornecer segurança em transmissões de dados e HTML ser uma linguagem para estruturar páginas da web.
3) Os termos abordam desde hardware de rede até linguagens de programação, visando explicar de forma sucinta o significado dessas siglas amplamente utilizadas no ambiente digital.
O CSS é uma folha de estilo que define a apresentação de páginas da web. Ele separa o formato do conteúdo e pode ser adicionado de três formas: externo, embutido ou inline. CSS permite estilizar elementos HTML, IDs ou classes através de seletores e propriedades. Unidades como pixels, em, porcentagem e outros controlam valores como cores, fontes e tamanhos.
O documento compara a Norma 508 e as WCAG, legislações dos EUA e do W3C respectivamente sobre acessibilidade digital. A Norma 508 exige que tecnologias do governo americano sejam acessíveis, enquanto as WCAG fornecem recomendações para tornar sites acessíveis. Embora tratem do mesmo tema, a Norma 508 se aplica ao governo e as WCAG são diretrizes voluntárias para desenvolvedores web.
Noções sobre os quatro princípios de acessibilidadediogolevel3
O documento descreve os quatro princípios de acessibilidade da web: perceptível, operável, compreensível e robusto. Ele explica que os conteúdos da web devem ser apresentados de forma que todos os usuários possam percebê-los, operá-los, compreendê-los e acessá-los com diferentes tecnologias.
O documento discute o conceito de Design Universal, que visa criar produtos, serviços e ambientes que possam ser usados por um maior número de pessoas possível, independentemente de idade, habilidade ou situação. O Design Universal surgiu nos anos 1970 e está ligado à acessibilidade, usabilidade e navegabilidade. Ele significa "design que inclui" ao invés de excluir certos grupos.
A aula de acessibilidade na Web ensinou os alunos sobre como é navegar na internet com deficiência visual, tentando ler um site com os olhos vendados. Eles encontraram muita dificuldade e entenderam melhor a importância da acessibilidade para que todos possam usar websites de forma igual. A acessibilidade na Web refere-se à prática inclusiva de criar sites acessíveis a todas as pessoas, independentemente de deficiências.
Design responsivo é um design de páginas da web que se adapta automaticamente a diferentes tamanhos de tela como desktops, tablets e celulares para melhorar a visualização e navegação. O documento descreve três passos para criar um layout responsivo: 1) estruturar o HTML para três tamanhos de tela, 2) definir regras CSS com cores diferentes para cada tela, 3) exibir o resultado final com a formatação adequada para cada dispositivo.
O documento discute a importância da acessibilidade na web. Ele explica o que é acessibilidade e como garantir que sites e conteúdos online sejam acessíveis para todos os usuários, independentemente de deficiências. Isso inclui fazer com que imagens, formulários, fontes e cores sejam acessíveis através do uso correto de atributos HTML.
O documento discute técnicas de abreviação em CSS. Ele explica como propriedades como cor, fonte, margem e padding podem ser abreviadas usando seus valores padrão quando valores omitidos. Exemplos mostram como abreviar valores hexadecimais de cores e definir várias propriedades de fonte em uma única declaração.
O documento descreve os diferentes tipos de seletores CSS, como o seletor universal (*), seletores de tipo de elemento (e), seletores contextual (e f), seletores de elementos filho (e > f) e pseudo-classes como :hover e :active que permitem estilizar elementos em diferentes estados.
O documento explica os diferentes tipos de seletores CSS, incluindo seletores de tipo de elemento, contextual, filho, classe, ID, atributo e pseudo-classes que permitem estilizar partes específicas de um documento HTML.
O documento descreve as quatro camadas do modelo TCP/IP: camada de aplicação, camada de transporte, camada de internet e camada de link. A camada de aplicação suporta protocolos como FTP, SMTP e HTTP. A camada de transporte fornece comunicação ponto-a-ponto de forma confiável ou não confiável. A camada de internet roteia pacotes usando o protocolo IP. A camada de link se conecta à rede física.
O documento descreve as sete camadas do Modelo OSI, incluindo a Camada Física, a Camada de Enlace, a Camada de Rede, a Camada de Transporte, a Camada de Sessão, a Camada de Apresentação e a Camada de Aplicação.
O documento descreve as sete camadas do Modelo OSI, incluindo a Camada Física, a Camada de Enlace, a Camada de Rede, a Camada de Transporte, a Camada de Sessão, a Camada de Apresentação e a Camada de Aplicação.
O documento fornece instruções sobre como criar um CSS para impressão de páginas da web. Ele explica que é importante preparar um CSS separado para impressão para fornecer uma visualização adequada ao imprimir páginas. Ele então discute como criar um novo CSS para impressão ou usar o CSS existente como base, e como declarar o CSS para impressão usando a propriedade "media" para que ele só se aplique à impressão.
O documento discute três tópicos principais sobre CSS avançado: 1) Efeito cascata e como regras CSS conflitantes são resolvidas, 2) Especificidade e como a especificidade de uma regra determina qual regra é aplicada, 3) Diferença entre link e @import e como cada um é usado.
O documento fornece definições para várias abreviações comumente usadas em internet e tecnologia da informação, incluindo POST, COOKIE, DNS, URL, CPU, ASP, PHP, PYTHON e RUBY ON RAILS. AJAX é definido como o uso de tecnologias como Javascript e XML para tornar páginas da web mais interativas com solicitações assíncronas de informações.
O documento fornece definições para termos relacionados à internet e tecnologia, incluindo:
1) Cliente-servidor descreve um modelo onde clientes solicitam dados de servidores através de uma rede;
2) PC refere-se a um computador pessoal para uso individual;
3) Home office descreve trabalhar remotamente de casa.
O documento lista abreviações comumente usadas em internet e tecnologia da informação, incluindo NIC, CERT, HTTPS, WEP, HTML, HTML5, Streaming, Flash, Plugin e JavaScript. As abreviações explicam termos como Network Interface Controller, segurança na internet, protocolos de comunicação, linguagens de marcação, transmissão de mídia, programas de animação e linguagens de programação.
O documento descreve os principais protocolos da Internet, incluindo HTTP para transferência de páginas web, SMTP para envio de email, FTP para transferência de arquivos, e TCP e IP que fornecem a base para a comunicação entre dispositivos na Internet.
1) O documento apresenta definições abreviadas para termos técnicos relacionados a redes e programação da web, como HTTPS, HTML, JavaScript e Flash.
2) As definições descrevem o que cada sigla representa e sua função principal, como HTTPS fornecer segurança em transmissões de dados e HTML ser uma linguagem para estruturar páginas da web.
3) Os termos abordam desde hardware de rede até linguagens de programação, visando explicar de forma sucinta o significado dessas siglas amplamente utilizadas no ambiente digital.
O CSS é uma folha de estilo que define a apresentação de páginas da web. Ele separa o formato do conteúdo e pode ser adicionado de três formas: externo, embutido ou inline. CSS permite estilizar elementos HTML, IDs ou classes através de seletores e propriedades. Unidades como pixels, em, porcentagem e outros controlam valores como cores, fontes e tamanhos.
1. Propriedades CSS
1.Bordas –
Propriedade
border-top-width
border-right-width
border-bottom-width
border-left-width
Descrição
Largura das bordas em cada um dos quatro lados: superior, direito,
inferior e esquerdo
Valores
[ thin | medium | thick | <tamanho> ]
Descrição
thin: espessura fina
medium: espessura média
thick: espessura grossa
Exemplo:
e {border-bottom-width: medium; }
Propriedade
border-width
Descrição
Atalho para definir de uma só vez larguras de bordas para todos os lados
Valores
[ thin | medium | thick | <tamanho> ] {1,4}
2. Descrição
Exemplos:
Todas as bordas com espessura 'thin':
e {border-width: thin;}
Bordas superior e inferior com espessura 'thin', bordas direita e
esquerda com espessura 'thick':
e {border-width: thin thick;}
Borda superior com espessura 'thin', bordas direita e esquerda com
espessura 'thick', borda inferior com espessura 'medium':
e {border-width: thin thick medium;}
Borda superior com espessura 'thin', borda direita com espessura
'thick', borda inferior com espessura 'medium', borda esquerda com
espessura 'thin':
e {border-width: thin thick medium thin;}
Propriedade
border-top-color
border-right-color
border-bottom-color
border-left-color
Descrição
Cor das bordas em cada um dos quatro lados: superior, direito,
inferior e esquerdo
Valores
[ <color> | transparent ]
Descrição
Exemplo:
e {border-top-color: black; }
3. Propriedade
border-color
Descrição
Atalho para definir de uma só vez cores de bordas para todos os lados
Valores
[ <color> | transparent ] {1,4}
Descrição
Exemplos:
Todas as bordas com a cor 'black':
e {border-color: black;}
Bordas superior e inferior com a cor 'black', bordas direita e esquerda
com a cor 'silver':
e {border-color: black silver;}
Borda superior com a cor 'black', bordas direita e esquerda com a cor
'silver', borda inferior com a cor 'gray':
e {border-color: black silver gray; }
Borda superior com a cor 'black', borda direita com a cor 'silver',
borda inferior com a cor 'gray', borda esquerda com a cor 'white':
e {border-color: black silver gray white; }
Propriedade
border-top-style
border-right-style
border-bottom-style
border-left-style
Descrição
Estilo de bordas em cada um dos quatro lados: superior, direito,
inferior e esquerdo
Valores
[ none | hidden | dotted | dashed | solid | double | groove | ridge |
inset | outset ]
4. Descrição
none: nenhuma borda (largura computada como zero)
hidden: idêntico à 'none', exceto na resolução de conflito de bordas nos
elementos de uma tabela
dotted: série de pontos
dashed: série de segmentos de pequenas linhas
solid: segmento de linha simples e contínua
double: Duas linhas 'solid'. A soma das duas linhas e o espaço entre
elas é igual ao valor definido em 'border-width'
groove: Efeito 3D, entalhada
ridge: Efeito 3D, oposto de 'groove': ressaltada
inset: Efeito 3D, baixo relevo
outset: Efeito 3D, alto relevo
Exemplo:
e {border-left-style:
dotted; }
Propriedade
border-style
Descrição
Atalho para definir de uma só vez estilos de bordas para todos os lados
Valores
[ none | hidden | dotted | dashed | solid | double | groove | ridge |
inset | outset ] {1,4}
Descrição
Exemplos: Todas as bordas com estilo 'solid':
e {border-style: solid;}
Bordas superior e inferior com estilo 'solid', bordas direita e esquerda
com estilo 'dotted':
e {border-style: solid dotted;}
Borda superior com estilo 'solid', bordas direita e esquerda com estilo
'dotted', borda inferior com o estilo 'dashed':
e {border-color: solid dotted dashed; }
Borda superior com estilo 'solid', borda direita com estilo 'dotted',
borda inferior com estilo 'dashed', borda esquerda com o estilo
'double':
e {border-color: solid dotted dashed double; }
5. Propriedade
border-top
border-right
border-bottom
border-left
Descrição
Atalho para definir largura, estilo e cor das bordas superior, direita,
inferior ou esquerda
Valores
[ <border-top-width> || <border-top-style> || <border-top-color> ]
Descrição
Exemplo:
e {border-bottom: thick solid red;}
Propriedade
border
Descrição
Atalho para largura, estilo e cor das quatro bordas
Valores
[ <border-top-width> || <border-top-style> || <border-top-color> ]
Descrição
Exemplo:
e {border: thick solid red;}
6. 2.Margens –
Propriedade
margin-top
margin-right
margin-bottom
margin-left
Descrição
Tamaho da margem para cada um dos lados: superior, direito, inferior e
esquerdo
Valores
[ <tamanho> | <porcentagem> | auto ]
Descrição
Exemplo:
body {margin-top: 2em }
Propriedade
margin
Descrição
Atalho para definir de uma só vez o tamanho da margem para todos os
lados
Valores
[ <tamanho> | <porcentagem> | auto ]{1,4}
7. Descrição
Exemplo:
Exemplos:
Todas as margens com 2em:
body {margin: 2em }
Margem superior e inferior com 1em, esquerda e direita com 2em:
body {margin: 1em 2em }
Margem superior com 1em; direita com 2em; inferior com 3em; e esquerda
com 2em:
body {margin: 1em 2em 3em }
Margem superior com 1em; direita com 2em; inferior com 3em; e esquerda
com 4em:
body {margin: 1em 2em 3em 4em }
Propriedade
padding-top
padding-right
padding-bottom
padding-left
Descrição
Distância utilizada para espaçamento em cada um dos quatro lados:
superior, direito, inferior e esquerdo
Valores
[ <tamanho> | <porcentagem> ]
Descrição
Exemplo:
body {padding-top: 2em }
Propriedade
padding
8. Descrição
Atalho para definir de uma só vez a distância de espaçamento para todos
os lados
Valores
[ <tamanho> | <porcentagem> ]{1,4}
Descrição
Exemplos:
Todas as margens com 2em:
body {padding: 2em }
Margem superior e inferior com 1em, esquerda e direita com 2em:
body {padding: 1em 2em }
Margem superior com 1em; direita com 2em; inferior com 3em; e esquerda
com 2em:
body {padding: 1em 2em 3em }
Margem superior com 1em; direita com 2em; inferior com 3em; e esquerda
com 4em:
body {padding: 1em 2em 3em 4em }
3.Cores e fundo –
Propriedade
color
Descrição
Cor do texto presente no elemento
Valores
[ <color>
Descrição
Exemplo:
e {color: red; }
e {color: rgb(255,0,0); }
9. Propriedade
background-color
Descrição
Cor de fundo do elemento
Valores
[ <color> | transparent ]
Descrição
Para 'transparent' será adotada a cor de fundo do elemento superior e na
ausência deste, a cor de fundo padrão do browser
Exemplo:
e {background-color: #f00; }
e {background-color: transparent; }
Propriedade
background-image
Descrição
Cor de fundo do elemento
Valores
[ <color> | transparent ]
Descrição
Exemplo:
e {background-image: url(http://caminho/imagem.jpg); }
10. Propriedade
background-repeat
Descrição
Define se e como a imagem de fundo utilizada se repetirá
Valores
[ repeat | repeat – x | repeat – y | no-repeat ]
Descrição
repeat: a imagem é repetida em ambas as direções: horizontal e vertical
repeat-x: a imagem é repetida somente horizontalmente
repeat-y: a imagem é repetida somente verticalmente.
no-repeat: a imagem não será repetida e somente uma cópia da mesma será
renderizada
Exemplo:
e {background-repeat: no-repeat;}
Propriedade
background-attachment
Descrição
Posição da imagem de fundo utilizada.
Valores
scroll: a imagem acompanha a rolagem da página na janela do browser,
mantendo-se como imagem de fundo
fixed: a imagem é fixada na página e não acompanhará a rolagem da página
11. Descrição
top: Equivalente a '0%' do posicionamento vertical
right: Equivalente a '100%' do posicionamento horizontal
bottom: Equivalente a '100%' do posicionamento vertical
left: Equivalente a '0%' do posicionamento horizontal.
center: Equivalente a '50%' do posicionamento horizontal ou '50%' do
posicionamento vertical
Exemplo:
body {background-position: right top; }
body {background-position: 100% 0; }
Propriedade
background-position
Descrição
Posição da imagem de fundo utilizada.
Valores
[ [ <porcentagem> | <tamanho> | left | center | right ] [ <porcentagem>
| <tamanho> | top | center | bottom]? ] | [ [ left | center | right ] ||
[ top | center | bottom ] ]
Descrição
top: Equivalente a '0%' do posicionamento vertical
right: Equivalente a '100%' do posicionamento horizontal
bottom: Equivalente a '100%' do posicionamento vertical
left: Equivalente a '0%' do posicionamento horizontal.
center: Equivalente a '50%' do posicionamento horizontal ou '50%' do
posicionamento vertical
Exemplo:
body {background-position: right top; }
body {background-position: 100% 0; }
12. Propriedade
background
Descrição
Atalho para definir de uma só vez todas as propriedades de imagem de
fundo
Valores
[ <background-color> || <background-image> || <background-repeat> ||
<background-attachment> || <background-position> ]
Descrição
Exemplo:
e {background: red url("chess.png")
repeat-x fixed 50% right; }
4.Fontes tipográficas –
Propriedade
font-family
Descrição
Família(s) de fontes
Valores
[ [ <nome-fonte> | <família-genérica> ] [, <nome-fonte> | <família-
genérica> ]* ]
13. Descrição
As seguintes famílias-genéricas de fontes são definidas em CSS2.1:
'serif'
'sans-serif'
'cursive'
'fantasy'
'monospace'
Exemplo: e {font-family: "New Century Schoolbook", serif; }
Propriedade
font-style
Descrição
Estilo utilizado na fonte
Valores
[ normal | italic | oblique ]
Descrição
normal: fonte do elemento sem efeito itálico ou oblíquo
italic: fonte do elemento com efeito itálico
oblique: fonte do elemento com efeito oblíquo
Exemplo:
e {font-style: italic; }
Propriedade
font-variant
14. Descrição
Exibe o texto em pequena caixa-alta (versalete) ou fonte normal
Valores
[ normal | small-caps ]
Descrição
normal: fonte do elemento sem efeito de capitalização small-caps: fonte
do elemento com efeito de pequena caixa alta (versalete)
Exemplo:
e {font-variant: small-caps; }
Propriedade
font-weight
Descrição
Peso da fonte
Valores
[ normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 |
700 | 800 | 900 ]
Descrição
normal: fonte do elemento com efeito padrão de peso (corresponde ao
valor 400)
bold: fonte do elemento com efeito de negrito (corresponde ao valor 700)
bolder: fonte do elemento com o valor de peso imediatamente superior ao
do valor herdado (p.ex: de 400 para 500)
lighter: fonte do elemento com o valor de peso imediatamente inferior ao
do valor herdado (p.ex: de 400 para 300)
Exemplo:
e {font-weight: bold; }
15. Propriedade
font-size
Descrição
Tamanho da fonte
Valores
[ [ xx-small | x-small | small | medium | large | x-large | xx-large] |
[larger | smaller] | <tamanho> | <porcentagem> ]
Descrição
medium: fonte do elemento com valor padrão de tamanho e equivalente ao
padrão do browser. Os demais valores ( xx-small | x-small | small |
large | x-large | xx-large) são calculados pelo browser considerando
esse valor 'medium'.
larger | smaller: aumenta ou diminui o tamanho em relação ao valor
herdado.
tamanho: valor absoluto. Não são permitidos valores negativos.
porcentagem: porcentagem do tamanho do valor herdado.
Exemplo:
e {font-size: 90%; }
Propriedade
font
Descrição
Atalho para definir de uma só vez todas as propriedades de fonte
Valores
[ [ [ <font-style> || <font-variant> || <font-weight> ]? <font-size> [ /
<line-height> ]? <font-family> ] | caption | icon | menu | message-box |
small-caption | status-bar ]
16. Descrição
Além dos valores para as propriedades de estilo, variação, peso,
tamanho, altura da linha e família, pode-se utilizar os seguintes, de
acordo com o ambiente do usuário:
caption: fonte utilizada por controles com legenda (ex.: botões, drop-
downs, etc.)
icon: fonte utilizada em ícones
menu: fonte utilizada em menus do sistema (ex.: dropdown menus e menus
suspensos)
message-box: fonte utilizada em caixas de diálogo.
small-caption: fonte utilizada em controles com legenda reduzida
status-bar: fonte utiliza em barra de status das janelas
Exemplo:
e {font: 300 italic 1.3em/1.7em "Helvetica", sans-serif; }
Propriedade
font-weight
Descrição
Peso da fonte
Valores
[ normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 |
700 | 800 | 900 ]
Descrição
normal: fonte do elemento com efeito padrão de peso (corresponde ao
valor 400)
bold: fonte do elemento com efeito de negrito (corresponde ao valor 700)
bolder: fonte do elemento com o valor de peso imediatamente superior ao
do valor herdado (p.ex: de 400 para 500)
lighter: fonte do elemento com o valor de peso imediatamente inferior ao
do valor herdado (p.ex: de 400 para 300)
Exemplo:
e {font-weight: bold; }
17. 5.Texto –
Propriedade
text-indent
Descrição
Recuo à esquerda da primeira linha em um bloco de texto
Valores
[ <tamanho> | <porcentagem> ]
Descrição
Exemplo:
e {text-indent: 3em; }
Propriedade
text-align
Descrição
Alinhamento do texto
Valores
[ left | right | center | justify ]
18. Descrição
left: alinhamento do texto à esquerda
right: alinhamento do texto à direita
center: alinhamento do texto centralizado
justify: alinhamento do texto justificado
Exemplo:
e {text-align: center; }
Propriedade
text-decoration
Descrição
Efeitos decorativos no texto como sublinhado, tachado, linha acima e
piscante
Valores
[ none | [ underline || overline || line-through || blink ] ]
Descrição
none: não produz decoração no texto do elemento
underline: cada linha de texto do elemento terá uma linha abaixo
(sublinhado)
overline: cada linha de texto do elemento terá uma linha acima
line-through: cada linha de texto do elemento terá uma linha cortando-o
ao meio (tachado)
blink: textos piscantes alternadamente entre visíveis e não visíveis
Exemplo:
e {text-decoration: underline; }
20. Descrição
Exemplo:
e {word-spacing: 1em; }
Propriedade
text-transform
Descrição
Transforma o texto em maiúsculas/minúsculas
Valores
[ capitalize | uppercase | lowercase | none ]
Descrição
capitalize: coloca o primeiro caracter de cada palavra do elemento em
maiúsculas (caixa alta)
uppercase: coloca todos os caracteres de cada palavra do elemento em
maiúsculas (caixa alta)
lowercase: coloca todos os caracteres de cada palavra do elemento em
minúsculas (caixa baixa)
none: não aplica efeitos de capitalização
Exemplo:
e {text-transform: capitalize; }
21. 6.Modelo de formatação visual –
Propriedade
float
Descrição
Posicionamento adjacente à esquerda ou à direita do elemento
Valores
{ left | right | none ]
Descrição
left: o elemento será posicionado flutuando à esquerda. O fluxo do
conteúdo não integrante do elemento será posicionado à direita a partir
do 'top' do elemento que recebe a propriedade 'float'
right: similar à 'left', mas com o elemento flutuando à direita
none: o elemento não flutua
Exemplo:
e {float: right;}
Propriedade
clear
Descrição
Controle para os posicionamentos float
Valores
[ none | left | right | both ]
22. Descrição
none: nenhum controle de limpeza de flutuação será executado
left: limpeza de flutuação à esquerda: o elemento será posicionado
abaixo da borda inferior do elemento flutuante à esquerda
right: limpeza de flutuação à direita: o elemento será posicionado
abaixo da borda inferior do elemento flutuante à direita
both: o elemento será posicionado abaixo da borda inferior de qualquer
elemento flutuante, seja à direita ou à esquerda
Exemplo: e { clear: both;}
Propriedade
width
Descrição
Largura
Valores
[ <tamanho> | <porcentagem> | auto ]
Descrição
Exemplo:
e {width: 25%;}
23. Propriedade
height
Descrição
Altura
Valores
[ <tamanho> | <porcentagem> | auto ]
Descrição
Exemplo:
e {height: 250px;}
Propriedade
line-height
Descrição
Distância entre as linhas de um texto
Valores
[ normal | <número> | <tamanho> | <porcentagem> ]
24. Descrição
Exemplo:
e {line-height: 1.2em;}
Propriedade
vertical-align
Descrição
Alinhamento vertical do texto
Valores
[ baseline | sub | super | top | text-top | middle | bottom | text-
bottom | <porcentagem> | <tamanho> ]
Descrição
baseline - A linha de base do elemento e do elemento superior (elemento-
pai) serão consideradas para alinhamento. Se não houver linha de base no
elemento, será considerado sua margem inferior
sub - A linha de base do elemento será alinhada com a linha de base de
conteúdo subscrito do elemento superior
super - A linha de base do elemento será alinhada com a linha de base de
conteúdo superescrito do elemento superior
top - Alinha o topo do elemento com a linha de topo do elemento superior
text-top - A base superior do elemento será alinhada com a linha
superior do conteúdo de textos do elemento-pai
middle - A linha central do elemento e de seu elemento superior serão
consideradas para alinhamento. (linha central do elemento superior =
ponto central da altura da letra 'x')
bottom - Alinha o rodapé do elemento com o rodapé do elemento superior
text-bottom - A base inferior do elemento será alinhada com a linha
inferior do conteúdo de textos do elemento-pai
Exemplo:
e {vertical-align: sub;}
25. Propriedade
vertical-align
Descrição
Alinhamento vertical do texto
Valores
[ baseline | sub | super | top | text-top | middle | bottom | text-
bottom | <porcentagem> | <tamanho> ]
Descrição
baseline - A linha de base do elemento e do elemento superior (elemento-
pai) serão consideradas para alinhamento. Se não houver linha de base no
elemento, será considerado sua margem inferior
sub - A linha de base do elemento será alinhada com a linha de base de
conteúdo subscrito do elemento superior
super - A linha de base do elemento será alinhada com a linha de base de
conteúdo superescrito do elemento superior
top - Alinha o topo do elemento com a linha de topo do elemento superior
text-top - A base superior do elemento será alinhada com a linha
superior do conteúdo de textos do elemento-pai
middle - A linha central do elemento e de seu elemento superior serão
consideradas para alinhamento. (linha central do elemento superior =
ponto central da altura da letra 'x')
bottom - Alinha o rodapé do elemento com o rodapé do elemento superior
text-bottom - A base inferior do elemento será alinhada com a linha
inferior do conteúdo de textos do elemento-pai
Exemplo:
e {vertical-align: sub;}
7.listas –
Propriedade
list-style-type
Descrição
Estilo visual aplicado aos marcadores de uma lista
26. Valores
[ disc | circle | square | decimal | decimal-leading-zero | lower-roman
| upper-roman | lower-greek | lower-latin | upper-latin | armenian |
georgian | lower-alpha | upper-alpha | none ]
Descrição
baseline - A linha de base do elemento e do elemento superior (elemento-
pai) serão consideradas para alinhamento. Se não houver linha de base no
elemento, será considerado sua margem inferior
sub - A linha de base do elemento será alinhada com a linha de base de
conteúdo subscrito do elemento superior
super - A linha de base do elemento será alinhada com a linha de base de
conteúdo superescrito do elemento superior
top - Alinha o topo do elemento com a linha de topo do elemento superior
text-top - A base superior do elemento será alinhada com a linha
superior do conteúdo de textos do elemento-pai
middle - A linha central do elemento e de seu elemento superior serão
consideradas para alinhamento. (linha central do elemento superior =
ponto central da altura da letra 'x')
bottom - Alinha o rodapé do elemento com o rodapé do elemento superior
text-bottom - A base inferior do elemento será alinhada com a linha
inferior do conteúdo de textos do elemento-pai
Exemplo:
e {vertical-align: sub;}
Propriedade
list-style-image
Descrição
Imagem aplicada aos elementos de uma lista
Valores
[ url("http://...") | none ]
27. Descrição
Exemplo:
li {
list-style-image: url("http://png.com/ellipse.png");}
Propriedade
list-style-position
Descrição
Posicionamento interno dos marcadores de uma lista
Valores
[ inside | outside ]
Descrição
inside – conteúdo da lista será indentado, mas o texto não será alinhado
após quebra de linha
outside – diferente de inside, o texto será alinhado na indentação mesmo
com quebra de linha
Exemplo:
ul {list-style-position: outside; }
ul.compact {list-style-position: inside;}
Propriedade
list-style
Descrição
Atalho para definir de uma só vez todas as propriedades de lista: type,
position e image.
28. Valores
[ <list-style-type> || <list-style-position> || <list-style-image> ]
Descrição
Exemplo:
li {list-style: decimal-leading-zero outside url(imagem.jpg); }
Fonte: W3C
Link: http://www.w3c.br/divulgacao/guiasreferencia/css2/#mod-seletores
Exemplos de CSS usando cores e propriedades