CSS_3.pdf

(2509 KB) Pobierz
CSS
CURSO W3C ESCRITÓRIO BRASIL
ÍNDICE
1.
2.
CSS
O que é CSS?
O que é um seletor?
Exemplo de funcionamento
“Stops” ou definindo o tamanho do seu gradiente
column-count
column-width
column-gap
CSS Transform na prática
Várias transformações em um único elemento
transform-origin
O básico: propriedade transition
Propriedade animation e regra keyframe
Definindo ciclos
Dividindo a imagem
Comportamento da imagem
Aplicação
5
5
7
8
Seletores complexos
7
3.
4.
Gradiente
Columns
11
12
15
15
16
17
18
18
21
24
28
31
32
32
15
5.
Transform 2D
17
6.
Transições e animações
21
7.
Bordas
31
8.
9.
Múltiplos backgrounds
Módulo Template Layout
Sintaxe e funcionamento
O funcionamento da propriedade display
Definindo a largura e altura dos slots
O funcionamento da propriedade position
Pseudo-elemento ::slot()
RGBA
35
37
39
39
41
42
43
45
45
47
10.
Cores
RGBA e a diferença da propriedade OPACITY
currentColor
45
11.
Paged media
@page
Terminologia e Page Model (modelo de página)
Page box
Page area
Margin box
Page sheet
Non-printable area - Área não impressa
Área de impressão
Propriedade size
auto
landscape
portrait
Page-size
Compatibilidade
Kit de sobrevivência
Como funciona o modelo
A propriedade presentation-level
49
49
50
50
51
51
51
52
52
52
52
52
52
53
56
56
57
58
12.
@font-face
55
13.
Presentation-levels
57
1. CSS
O que é CSS?
O CSS formata a informação entregue pelo HTML. Essa informação pode ser qualquer coisa: ima-
gem, texto, vídeo, áudio ou qualquer outro elemento criado. Grave isso: CSS formata a informação.
Essa formatação na maioria das vezes é visual, mas não necessariamente. No CSS Aural, nós ma-
nipulamos o áudio entregue ao visitante pelo sistema de leitura de tela. Nós controlamos volume,
profundidade, tipo da voz ou em qual das caixas de som a voz sairá. De certa forma você está for-
matando a informação que está em formato de áudio e que o visitante está consumindo ao entrar
no site utilizando um dispositivo ou um sistema de leitura de tela. O CSS prepara essa informação
para que ela seja consumida da melhor maneira possível.
O HTML5 trouxe poucas novidades para os desenvolvedores client-side. Basicamente foram cria-
das novas tags, o significado de algumas foi modificado e outras tags foram descontinuadas. As no-
vidades interessantes mesmo ficaram para o pessoal que conhece Javascript. As APIs que o HTML5
disponibilizou são sem dúvida uma das features mais aguardadas por todos estes desenvolvedores.
Diferentemente do CSS3 que trouxe mudanças drásticas para a manipulação visual dos elementos
do HTML.
Com o CSS que nós conhecemos podemos formatar algumas características básicas: cores, back-
ground, características de font, margins, paddings, posição e controlamos de uma maneira muito
artesanal e simples a estrutura do site com a propriedade float.
Você deve pensar: “mas com todas as características nós conseguimos fazer sites fantásticos, com
design atraente e com a manutenção relativamente simples”. E eu concordo com você, mas outras
características que nós não temos controles e dependemos de:
CSS - Curso W3C Escritório Brasil
5

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin