quarta-feira, 18 de fevereiro de 2015

HTML e CSS: Aula 03. Cores e imagens no background


Tabela de cores HTML.

Fonte: http://www.linhadecodigo.com.br/artigo/3574/codigo-cor-infografico-dos-codigos-das-cores-em-html.aspx


Tabela de símbolos HTML.
denominação código resultado
letra grega alfa (alpha) α α
letra grega beta (beta) β β
letra grega gama (gamma) γ γ
letra grega gama maiúscula &Gamma Γ
letra grega delta (delta) δ δ
letra grega delta maiúscula Δ Δ
letra grega epsilon (epsilon) ε ε
letra grega teta (theta) θ θ
letra grega teta maiúscula Θ Θ
letra grega lambda (lambda) λ λ
letra grega lambda maiúscula Λ Λ
letra grega mi (mu) μ μ
letra grega ni (nu) ν ν
letra grega qui (xi) ξ ξ
letra grega pi (pi) π π
letra grega sigma (sigma) σ σ
letra grega sigma maiúscula Σ Σ
letra grega tau (tau) τ τ
letra grega fi (phi) φ φ
letra grega fi maiúscula Φ Φ
letra grega psi (psi) ψ ψ
letra grega psi maiúscula Ψ Ψ
letra grega ômega (omega) ω ω
letra grega ômega maiúscula Ω Ω
flecha para a esquerda
(leftwards arrow)
←
flecha para cima
(upwards arrow)
↑
flecha para a direita
(rightwards arrow)
→
flecha para baixo
(downwards arrow)
↓
implica que ⇒
equivale a ⇔
qualquer que seja
(for all)
∀
operador de derivada parcial
(partial diferential)
∂
existe (exist) ∃
operador nabla ∇
pertence a (is in) ∈
contém (in invertido) ∋
soma (sum) ∑
sinal de raiz
(radical sign)
√
proporcional a ∝
infinito ∞
ângulo ∠
e lógico ou cunha
(logical e or wedge)
∧
ou lógico (or) ∨
intersecção ∩
união ∪
integral ∫
portanto (therefore) ∴
diferente (not equal) ≠
por definição
(identical or equivalent)
≡
menor que &lt; <
maior que &gt; >
et = & (ampersand) &amp; &
subconjunto de &sub;
superconjunto de &sup;
subconjunto (com igual) &sube;
superconjunto (com igua) &supe;
perpendicular a &perp;
aspa simples esquerda
(left simple quotation)
&lsquo;
aspa simples direita
(right simple quotation)
&rsquo;
aspas duplas esquerdas &ldquo;
aspas duplas direitas &rdquo;
adaga (dagger) &dagger;
adaga dupla &Dagger;
por milhar &permil;
aspa angular esquerda &lsaquo;
aspa angular direita &rsaquo;
não lógico &not; ¬
libra (pound) &pound; £
yen &yen; ¥
sinal de seção (section) &sect; §
copyright &copy; ©
marca registrada
(trade mark)
&reg; ®
grau (degree) &deg; °
mais ou menos
(plus-minus sign)
&plusmn; ±
ao quadrado &sup2; ²
ao cubo &sup3; ³
micro &micro; µ
sinal de parágrafo &para;
um quarto &frac14; ¼
um meio &frac12; ½
três quartos &frac34; ¾
símbolo de vezes (times) &times; ×
símbolo de dividir &divide; ÷
conjunto vazio ou
o cortado (o slash)
&Oslash; Ø
conjunto vazio minúsculo &oslash; ø
Fonte: http://www.ime.unicamp.br/~marcio/hpteia/html/sbolos.html.

HTML5 e CSS3: Aula 03, cores e imagens no background.
Nessa vídeo aula utilizamos as tags h1, h2 e p. Inserida uma cor diferente em cada tag e também inserida uma imagem de fundo na página inteira repetidas vezes.
O intuito dessa aula é ver como funciona essa inserção.

Código fonte do documento HTML:

 <!DOCTYPE html>

<html>
<head>
<title>Página</title>
<link rel="stylesheet" href="css/cssaula3.css">
</head>
<body>
 <h1>Primeiro título</h1>
 <p>Qualquer frase com mais de 5 palavras.</p>
 <h2>Segundo Título</h2>
 <p>Qualquer frase com mais de 5 palavras que seja diferente da tag &lt;p&gt; anterior.</p>
</body>
</html>

Código fonte do documento CSS:
 h1 {
       background-color: yellow;
}
h2 {
      background-color: red;
}
p {
      background-color: gold;
}

body {
      background: url(pastadaimagem/imagem.png);
}