Você está na página 1de 4

METAS -> HTML E CSS (1 SEMANA PARA ACABAR), JAVASCRIPT, LINGUAGEM BACK-END (C#),

BANCO DE DADOS (SQL SERVER)

CORES

Círculo cromático (Harmonizar cores)

Cores primárias (Amarelo, Vermelho, Azul)

Cores secundárias (Laranja, Violeta, Verde)

Cores Terciárias
(Entre uma cor primaria e uma cor secundaria)
(Ex: Amarelo esverdiado, Amarelo alaranjado,
Vermelho alaranjado, Vermelho arroxeado,
Azul arroxeado, Azul esverdeadado)

Cores Complementares (Usar uma cor que esta no oposto no


círculo cromático)

Cores análogas (Não tem contraste tão grande mas são


perceptíveis)

Cores análogas e uma complementar (Usar cores vizinhas da


sua cor principal e usar uma que contraste com elas)

Cores análogas relacionadas (Duas cores vizinhas, e uma


outra que é similar e tenha um contraste não tão grande)

Cores intercaladas (Pular uma cor no círculo cormático)

Cores triádicas (Pular 3 cores e usar a cor seguinte)

Cores em quadrado (Pular 2 cores e usar a cor seguinte)

Cores tetrádicas (2 Cores de referência e usar a do


oposto no circulo cromático)

Monocromia (Usar 1 cor de referencia e modificar ela com


saturação e luminosidade)

Adobe color (Melhor site para achar paletas de cores)


Paletton (Outro bom site para achar paleta de cores)

TIPOGRAFIA

Pensar na sua fonte a paritr do que vc vai fazer seu site

Categoria (cerifadas, sans-serif, monoespaçadas,

handwriting -> sensação de feita a mão, display)

Medidas absolutas (cm,mm,in->polegadas, px, pt, pc)

Medidas Relativas (em, ex, rem, vw, vh, %)

16px geralmente = 1em


RECOMENDAÇÃO (px ou em, em -> melhor de ser utilizado)

whatfontis (Site para pegar fontes de imagens)

CSS

background-image: linear-gradient (Fazer um degrade)

*{} (Config global)

@charset "UTF-8";(Não dar problema de compatibilidade


com acento)

box-shadow(Sombra na caixa)

text-shadow (Sombra no texto)

font-size (Tamanho da fonte) -> em ou px

weight (peso -> lighter, normal, bold, bolder )

widht (largura)

height (altura)

font-style (Estilo da fonte)

text-decoration: underline (Deixar textos sublinhados)

SHORTHAND
font - font-style->font-weight-> font-size-> font-family

@font face (Usar fontes externas) format (Truetype->ytf, Opentype->otf)

text-align (alinhar textos -> o padrão é a esquerda)

ID (Identificador ->Usado para especificar) Só pode ter 1 elemento

# (Tudo que for id em HTML é # em CSS)

class (Tudo que em HTML é class em CSS é .) Posso ter vários elementos

. (Tudo que for class em HTML vai ser . em CSS)

: (Pseudo-class)

:: (Pseudo elementos)

> (Children)

border (borda)

:hover (possibilita um elemento ter o seu estilo alterado através da ação do


usuário, quando o próprio passa o cursor do mouse sobre o elemento.)

:visited (é uma Pseudo-classe do CSS para indicar se o link em questão já foi


visitado pelo usuário. Por questões de privacidade, os styles que podem ser
modificados usando este seletor são muito limitados.)
:active (Esse estilo pode ser substituído por qualquer outra pseudo-classe
relacionada ao link, ou seja, :link, :hover e :visited, aparecendo nas regras
subseqüentes. Para estilizar apropriadamente os links, você precisa colocar a regra
:active depois de todas as outras regras relacionadas ao link, conforme definido
pela ordem LVHA. :link — :visited — :hover — :active.)

Borda (Linha que circunda seu conteúdo) em CSS fica border

Padding (Deixar a borda distante do conteúdo) da borda pra dentro. Sempre no


sentido horário

Margin (Da borda pra fora)

outline é uma propriedade abreviada para configurar uma ou mais das propriedades de
contorno

Tipos de caixa (Box-Level e Inline-level)

Box-level -> <div> (Vai começar em uma linha nova e ocupa 100% da tela)

Inline-level -> <span> (Não quebra linha e não o cupa a tela inteira)

User agent (é sempre o navegador que esta exibindo o seu conteúdo)

Margin-auto (Centralizar)

GIT (Repositório local)

GITHUB (Repositório remoto) login:felipekanachiro@gmail.com senha: Kenji0501*

Shorthand - background
color > image > position > repeat > [size] > attachment

Quando se coloca um posicionamento absoluto em um elemento vc pode configurar as


propriedades left e top

text-transform: uppercase; Transforma as letras em maiúsculas

font-variant: small-caps; deixa as letras maiúsculas mas a primeira letra fica


maior do que as outras

Não posso utilizar tabela para montar a estrutura do meu site

Hierarquia de tabelas (simples)


TABLE = tabela
TABLE ROW = linha de tabela
TABLE HEADER = CABEÇALHO DE TABELA
TABLE DATA = dado de tabela

Se a hierarquia n for obedecida os dados vão aparecer ou antes ou depois da tabela

Mesclagem de células (colspan="" ocupa colunas) (rowspan="" ocupa linhas) (Coluna é


para os lados e Linha é para cima ou para baixo)

Tamanho padrão é de 300px de largura e 150px de altura dos iframes


CSS é soberana

scolling (Rolagem do iframe)

Você também pode gostar