Começando HTML5 e CSS3 For Dummies

A tabela a seguir contém uma lista de cores nomeadas você pode usar no código HTML e CSS para criar um site mais colorido. As cores são mostradas com seus valores hexcode RGB correspondentes juntamente com uma amostra de cor representativa.

NomeHexcode
água# 00FFFF
Preto# 000000
Azul# 0000FF
Fúcsia# FF00FF
Cinzento# 808080
Verde# 008000
Lima# 00FF00
Maroon# 800000
Marinha# 000080
Oliva# 808000
Roxa# 800080
Vermelho# FF0000
Prata# C0C0C0
Cerceta# 008080
Branco#FFFFFF
Amarelo# FFFF00

Conheça os seus elementos!

Aparecimento em ordem alfabética, uma lista de todos os elementos contidos na HTML5 HTML5 especificação actual. Uma breve descrição está incluído como uma referência rápida quando se olha para o elemento perfeito.

Elemento Descrição
UMAUse para criar hiperlinks
abbrUse para abreviaturas
endereçoInformações de contato
ÁreaHiperlink em uma imagem-map
artigo*Fornece seção formatação para itens expositivas curtas, como artigos, blogs, etc.
de lado *pedaço ligeiramente relacionado de conteúdo para página de acolhimento
auditivo *Usado para adicionar áudio para reprodução associada com a página web
bTexto em negrito
baseURL base
BDI *Isolar texto que pode ser formatado em uma direção diferente do texto em torno dele
bdoUse para especificar a direção do texto
blockquotebloco de citação
corpocorpo do documento
brquebra de linha
botãoCria um botão.
lona*Utilize para definir uma região de páginas no qual o desenho pode ocorrer
rubricatítulo da tabela
citartítulo citado de uma obra
códigofragmento de código
colColuna em uma tabela
colgroupGrupo de colunas da tabela
comando*Utilize para definir elementos do usuário GUI
datalist *Use para criar uma lista de entrada elementos para menus suspensos
ddDescrição
delO texto excluído
detalhes *Fornece informações adicionais ou controles para os usuários sob demanda
dfndefinindo instância
divcontêiner genérico
dlDescrição lista
dtTermo ou nome
emÊnfase
embutir *Links para o aplicativo externo ou conteúdo interativo
fieldsetcontroles de formulários relacionados
figcaption *Fornecer uma legenda para um figura elemento
figura*element- conteúdo de fluxo Standalone pode ser estático ou dinâmico
rodapé*Concluindo informações para uma seção do documento
FormatoDefine uma forma submittable pelo usuário
h1 - h6cabeçalhos
cabeçaRecipiente para metadados sobre os documentos, scripts e estilos
cabeçalho*Cabeçalho do documento
hgroup *título de grupo
hrrégua horizontal / break temático
htmlelemento raiz
EuO texto em itálico
iframeconteúdo de navegação aninhada
imgImagem
entradacontrole de entrada
instexto inserido
kbdA entrada do usuário
keygen *controle acessível ao utilizador para gerar pares de chaves de segurança ou criptografia
rótuloLegenda para um controle de formulário
lendalegenda explicativa
liitem da lista
ligaçãoMetadados para a ligação de documentos externos
mapaDefinir uma imagem de mapa de
marca*Mark ou destacar uma série de texto em um documento, por referência em outro documento
cardápioLista de comandos
metametadados
metros *Definir um indicador visual de algum tipo de medição
nav *Utilize para definir uma barra de navegação ou área em uma página da web
noscriptDefinir conteúdo a ser exibido no caso o script não pode ser executado
objetoconteúdo externo
ollista ordenada
optgroupDefinir um grupo de opções
saída*Algum tipo de saída do cálculo script ou chamada de API
pParágrafo
paramUsar para fornecer parâmetros para plugins
prétexto pré-formatado
progresso*Um medidor visual para a conclusão da tarefa (barra de progresso)
qtexto citado
rp *Use para colocar parênteses em torno de anotações Ruby
rt *Use para marcar o texto de uma anotação ruby
rubi*Use para anotar idiomas ideográficos como o chinês ou japonês
sMarca o texto removida, com greve através de formatação.
farinha grossaExemplo de saída
escritascript incorporado
seção*documento genérico ou seção de aplicação
selecionarOpção de controle de formulário de seleção
pequenotexto pequeno
fonte*Use para especificar múltiplas fontes de áudio e vídeo
palmoUm wrapper de texto genérico
Fortetexto importante. Geralmente é formatado como negrito
estiloinformações de apresentação, normalmente CSS
subtexto subscrito
resumo*Resumo, legenda, ou legenda para a entrada de detalhes informações
ceartexto sobrescrito
mesaMesa
tbodyGrupo de linhas da tabela
tdcélula da tabela
textareaárea de entrada de texto
tfootTabela grupo linha de rodapé
ºcélula cabeçalho da tabela
theadTabela grupo linha de título
Tempo*Valor que representa a data e / ou hora de
títuloTítulo do documento
trlinha da tabela
rastrear *Especifique uma faixa suplementar media
vocêSublinhado
ullista não ordenada
varUse para especificar uma variável matemática ou programação, ou um espaço reservado
vídeo *Use para reproduzir conteúdo de vídeo na página web
wbr *Use para denotar possível ponto de quebra de linha para o fluxo de texto

* Novo em HTML5

CSS Referência do imóvel

A tabela a seguir mostra as propriedades CSS que são suportados pela maioria dos navegadores de hoje, juntamente com os seus valores permitidos. Algumas dessas propriedades são parte das especificações do CSS3 e ainda são experimentais, então não se esqueça de verificar com o Eu posso usar local para as últimas informações sobre o suporte ao navegador. (Para obter ajuda lendo a coluna Valores de este gráfico, veja o artigo "Um guia rápido para o CSS Valor definição de sintaxe" no aborrecido.ru/extras/beginninghtml5css3.)

Nome valores
animação ||
animação em atraso
animação direçãonormais | alternativo | reverter | inversa alternativo
animação duração
animation-fill-modeNenhum | forwards | para trás | ambos
animação iteração contageminfinita |
animation-nameNenhum |
animation-play-statecorrer | pausado
animation-timing-function
backface visibilidadevisível | escondido
background-attachmentrolar | fixa | herdar
background-clipeborder-box | padding-box | Conteúdo-box | herdar
cor de fundo | herdar
imagem de fundo | Nenhum | herdar
background-origemborder-box | padding-box | Conteúdo-box | herdar
background-position[[ | | deixou | centro | certo ] [ | | top | centro | inferior ]? ] | [[Esquerda | centro | right] || [Top | centro | bottom]] | herdar
fundo de repetiçãorepetir | repetir-x | repetir-y | no-repeat | herdar
background-size | | auto | cobrir | conter
fundo[ 'Background-color' || || Background-position 'background-image' || 'background-repete' || 'background-attachment'] | herdar
border-collapsedesmoronar | separado | herdar
Cor da borda[ ] {1,4} | herdar
border-imageNenhum |
border-image-início[ 'lados' || "Horizontal" || 'Vertical' || 'Top' || 'Bottom' || 'Direito' || 'Esquerda'] | herdar
border-image-repeat[ 'Type' || "Horizontal" || 'Vertical' || 'Stretch' || 'Repeat' || 'Round'] | herdar
border-image-sourceNenhum |
border-image-slice[ | ] {1,4} preencher?
border-image-largura[ | | | auto] {1,4}
border-radius[ | ] {1,4} [/ [ | ] {1,4}]?
border-spacing ? | herdar
estilo de borda{1,4} | herdar
border-top border-right border-bottom border-left[|| || Border-top-color] | herdar
border-right border-top-color; color border-bottom-color border-left; cor | herdar
border-top-left; raio border-top-direita; raio de border-bottom-left; raio de border-bottom-direita; raio[ |
] {1,2}
border-top-style border-right; border-left style-bottom border-style; estilo | herdar
border-top-width border-right; width border-bottom-width border-left; width | herdar
border-width{1,4} | herdar
fronteira[|| || Border-top-color] | herdar
inferior | | auto | herdar
box-shadowNenhum | [inserir? [? ? ? ]] #
quebrar-depoisauto | sempre | evitar | deixou | direito | página | coluna | evitar-page | evitar-coluna
break-beforeauto | sempre | evitar | deixou | direito | página | coluna | evitar-page | evitar-coluna
caption-sidetop | bottom | herdar
ClaroNenhum | deixou | direito | ambos | herdar
grampo | auto | herdar
cor | herdar
colunaslt; 'column-width'> || lt; 'column-count'>
coluna de contagem | auto
coluna de enchimentoauto | equilibrar
column-gap | normal
coluna da regralt; 'column-regra-width'> || lt; 'column-regra-style> || lt; 'column-regra-color>
coluna da regra-color
coluna da regra de estilo[Nenhum | escondida | pontilhada | frustradas | sólido | dupla | sulco | cume | inset | início] | herdar
coluna da regra de largura | [Fina | médio | Grosso]
coluna-spanNenhum | todos | herdar
largura da coluna | auto
conteúdonormais | Nenhum | [ | | | attr () | abrir-quote | close-quote | no-open-quote | no-fim-quote] + | herdar
counter-increment[ ? ] + | Nenhum | herdar
counter-reset[ ? ] + | Nenhum | herdar
cursor[[ ,] * [Auto | mira | padrão | ponteiro | mover | e-redimensionamento | ne-redimensionamento | nw-redimensionamento | n-redimensionamento | se-redimensionamento | sw-resize | s-resize | w-redimensionamento | texto | esperar | ajudar | progresso]] | herdar
direçãoltr | RTL | herdar
exibiçãoem linha | bloquear | list-item | inline-block | mesa | inline-table | table-row-group | table-header-group | table-footer-grupo | table-row | table-column-grupo | tabela de coluna | table-celular | table-caption | Nenhum | herdar
empty-cellsmostrar | esconder | herdar
flutuadordeixou | direito | Nenhum | herdar
família de fontes[[| ] [, | ] *] | herdar
tamanho da fonte | | | | herdar
estilo de fontenormais | itálico | oblíqua | herdar
font-variantnormais | small-caps | herdar
font-weightnormais | negrito | mais ousado | mais leve | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | herdar
fonte[[ 'Font-style' || "Font-variant '|| "Font-weight ']?' Font-size '[/' line-height ']? font-family] | caption | icon | Menu | message-box | pequeno-caption | Status-bar | herdar
altura | | auto | herdar
@keyframes[[A partir de | para | ] [, A partir de | para | ]* quadra ]*
esquerda | | auto | herdar
letter-spacingnormais | | herdar
altura da linhanormais | | | | herdar
list-style-image | Nenhum | herdar
list-style-positiondentro | fora | herdar
list-style-typedisco | círculo | quadrado | decimal | decimal-líder de zero | lower-roman | upper-romano | inferior grego | inferior Latina | superior latin | armenian | georgian | inferior-alfa | superior-alfa | Nenhum | herdar
list-style[ '-Style-type list' || "-List-style posição '|| list-style-image] | herdar
margin-right margin-left | herdar
margin-top margin-bottom | herdar
margem{1,4} | herdar
altura máxima | | Nenhum | herdar
largura máxima | | Nenhum | herdar
min-height | | herdar
min-width | | herdar
opacidade | herdar
órfãos | herdar
outline-color | inverter | herdar
outline-style | herdar
outline-width | herdar
esboço[ 'Outline-color' || 'Outline-style' || outline-width] | herdar
transbordarvisível | escondida | rolar | auto | herdar
estouro-wrapnormais | quebrar-word | herdar
overflow-xvisível | escondida | rolar | auto | herdar
overflow-yvisível | escondida | rolar | auto | herdar
padding-top padding-right padding-bottom padding-left | herdar
preenchimento{1,4} | herdar
page-break-afterauto | sempre | evitar | deixou | direito | herdar
-Page-break antesauto | sempre | evitar | deixou | direito | herdar
page-break-insideevitar | auto | herdar
perspectivaNenhum |
perspectiva de origem[ | | deixou | centro | direito | top | bottom] | [[ | | deixou | centro | certo ] [ | | top | centro | inferior ] ]
posiçãoestática | relativa | absoluto | fixa | herdar
citações[ ] + | Nenhum | herdar
certo | | auto | herdar
table-disposiçãoauto | fixa | herdar
text-aligndeixou | direito | centro | justificar | herdar
text-decorationNenhum | [Sublinhar || overline || line-through || piscar] | herdar
text-indent | | herdar
text-transformcapitalizar | maiúscula | minúsculas | Nenhum | herdar
topo | | auto | herdar
transformarNenhum | +
transform-origin[ | | deixou | centro | direito | top | bottom] | [[ | | deixou | centro | certo ] [ | | top | centro | inferior ] ] ?
transformar-styleplana | preservar-3d
transição[Nenhum | ] ||
transition-delay
duração da transição
transição-timing-function
de transição de propriedadeNenhum | # [ ',' #] *
unicode-bidinormais | incorporar | bidi-override | herdar
vertical-alignlinha de base | sub | Super | top | text-top | Médio | bottom | text-bottom | | | herdar
visibilidadevisível | escondida | desmoronar | herdar
white-spacenormais | pre | nowrap | pré-wrap | pré-line | herdar
viúvas | herdar
largura | | auto | herdar
word-spacingnormais | | herdar
z-indexauto | | herdar

menu