Notes
Curso Web Completo
Content of the notes (3)
Page 1
Definição do tamanho da fonte
font-size: (unidade absoluta) | (unidade relativa)
Unidade absoluta
Unidades absolutas ou fixas são exibidas no tamanho solicitado, independente do dispositivo ou contexto. Utiliza px (pixels) como parâmetro de tamanho.
Unidade relativa
Unidades relativas são exibidas com o tamanho proporcional ao tamanho do dispositivo. Utiliza o parâmetro "em" (ex: 1em, 2em, 1.5em) ou porcentagem %.
font-weight -> Define a espessura da fonte.
font-style -> Define o formato da fonte.
font-size -> Define o tamanho da fonte.
text-align -> Define o alinhamento do texto. (righ , left , center , justify)
line-height -> Define a altura da linha. ( "em" , "px")
text- indent -> Define a indentação do texto. ( "em" , "px")
text-decoration -> Define o sublinhamento do texto.
underline = Linha abaixo do texto.
overline = Linha acima do texto.
line-throught = Linha sobre a palavra.
blink = piscando.
none = nenhum.
text-transform -> Define a forma do texto. (maiusculo, minusculo...)
uppercase = Todas as letras maiusculas.
capitalize = Todas as primeiras letras maiusculas.
lowercase = Todas as letras minusculas.
letter-spacing -> espaçamento entre as letras. ("em" , "px")
word-spacing -> espaçamento entre as palavras. ("em" , "px")
.detalhe {
font-weight: normal | bold | bolder | lighter |
100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit;
font-style: normal | italic |oblique | inherit;
}
Page 2
Cores
Especificações de cores
propriedade | valor
color | red
color | #ff0000 (hexadecimal)
color | rgb (255,0,0)
Padrão RGB
Red (vermelho) -> 255
Green (verde) -> 186
Blue (azul) -> 204
Padrão Hexadecimal shorthand (abreviada)
#FFCC00 -> #FC0
HSL Color
Hue (0 a 360)
Saturation (0-100%)
Lightness (0-100%)
Lista completa:
http://www.w3.org/TR/2011/REC-css3-color-2011-6-7/#sug-color
Page 3
Box Model
Propriedades de posicionamento
absolute
relative
fixed
static
float : Flutuação
left = <
right = >
none = nenhum
inherit = herda uma característica de um elemento pai.
OBS: Se define margin e padding da mesma forma.
Propriedades da Borda
border-style -> Define o estilo da borda.
solid = Linha solida.
dashed = Linha tracejada.
ridge
inset
outset
border-width -> Define
thin
medium
trick
Propriedades do background
background-color = aplicar cor.
background-image = aplicar uma imagem.
background-repeat: no-repeat; (não repetir a imagem)
background-repeat: repeat-x; (repetir apenas no eixo x)
background-repeat
no-repeat; (não repetir a imagem)
repeat-x; (repetir apenas no eixo x)
background-attachment
background-position
top; (centro do topo)
right top; (topo a direita)
right center; (centro a direita)
background-blend-mode
background-clip