<b>/<strong>Texto em negrito

<u>/<ins>Modo de exibição de sublinhado

<i>/<em>O texto é exibido em itálico

O texto <s>/<del> é exibido tachado

etiqueta de tempo

marcar caracteres de destaque

citar referência de tag

alinhar

<h>

<por>

<br/>

Fonte

imagem

Seletor {Atributo 1: Valor do atributo 1; Atributo 2: Valor do atributo 2;....}

em linha

Integrado

link externo

Importado

Seletores básicos funcionam nesses três

seletor de tags

seletor de classe

seletor de identificação

seletor curinga

id>classe>padrão>curinga

Propriedades de estilo de texto

propriedades de aparência de texto

Características avançadas

Seletor de irmãos próximos: use o número para conectar

Seletor de irmãos comum: use ~ para vincular antes e depois

borda superior

Borda inferior

borda esquerda

borda direita

Configurações de estilo abrangentes

Configurações abrangentes de largura

Configurações abrangentes de cores

Configurações abrangentes de borda

padding-top: margem superior

preenchimento à direita: preenchimento à direita

padding-bottom: preenchimento inferior

preenchimento esquerdo: preenchimento esquerdo

preenchimento: preenchimento superior [preenchimento direito, preenchimento inferior, preenchimento esquerdo]

margin-top: margem superior

margem direita: margem direita

margem inferior: margem inferior

margem esquerda: margem esquerda

margem: margem superior [margem direita, margem inferior, margem esquerda]

cor de fundo: cor de fundo:

imagem de fundo:imagem de fundo:url()

Ladrilho da imagem de fundo: background-repeat:property

Posição da imagem de fundo: posição de fundo: canto inferior direito;

Imagem de fundo corrigida

Conjunto abrangente de elementos de fundo

rgba (r, g, b, alfa) rgb representa a metade da proporção da cor alfa é um parâmetro 0,0 é completamente transparente e 1,0 é completamente opaco;

opacidade: parâmetro entre 0~1

border-radius: Parâmetro de raio horizontal 1 Parâmetro de raio horizontal 2 Parâmetro de raio horizontal 3 Parâmetro de raio horizontal 4/Parâmetro de raio vertical 1 Parâmetro de raio vertical 2 Parâmetro de raio vertical 3 Parâmetro de raio vertical 4;

border-image-source especifica o caminho da imagem

border-image-slice especifica o deslocamento interno dos lados superior, direito, inferior e esquerdo da imagem da borda

border-image-width especifica a largura da borda

border-image-outset especifica a distância que o fundo da borda se estende até fora da caixa

border-image-repeat especifica o método lado a lado da imagem de fundo

h-shadow representa a posição da sombra horizontal, que pode ser um valor negativo (atributo obrigatório)

v-shadow representa a posição da sombra vertical, que pode ser um valor negativo (atributo obrigatório)

desfoque raio de desfoque de sombra (atributo opcional)

raio de expansão de sombra espalhada, não pode ser negativo (atributo opcional)

colorShadow color (atributo opcional)

O padrão de início/introdução é sombra externa/sombra interna (atributo opcional)

Imagem de fundo gradiente linear:gradiente linear (ângulo do gradiente, valor da cor 1, valor da cor 2...·..., valor da cor n);

Imagem de fundo gradiente radial: gradiente radial (forma de gradiente quatro posições centrais, valor de cor 1, valor de cor 2. valor de cor m;

Imagem de fundo de gradiente linear de repetição:gradiente linear de repetição (ângulo de gradiente, valor de cor 1, valor de cor 2..., valor de cor n);

Repita a imagem de fundo do gradiente radial:repeatina-radial-arradient (posição central do círculo da forma do gradiente, valor da cor 1, valor da cor 2..., valor da cor n);

Várias imagens de fundo

Defina o tamanho da imagem de fundo: background-size: valor do atributo 1 valor do atributo 2;

Defina a área de exibição da imagem de fundo: background-origin: valor do atributo;

Defina a área de recorte da imagem de fundo: background-clip

inline: este elemento será exibido como um elemento inline (o valor do atributo de exibição padrão dos elementos inline) bloco: este elemento será exibido como um elemento de bloco (o valor do atributo de exibição padrão do elemento de bloco). bloco embutido: este elemento será exibido como um elemento de bloco embutido e atributos como largura, altura e alinhamento podem ser definidos nele, mas o elemento não ocupará uma única linha. nenhum: Este elemento ficará oculto, não será exibido e não ocupará espaço na página, o que equivale ao elemento não existente.

<ol> <li>Item 1 da lista</li> <li>Item 2 da lista</li> <li>Item 3 da lista</li> </ol>

tipo: valor do atributo (1 padrão)/a-A/i-I

número inicial (especifica o valor inicial do marcador)

número do valor (o número que especifica o marcador)

<ul> <li>Item 1 da lista</li> <li>Item 2 da lista</li> <li>Item 3 da lista</li> </ul>

tipo-

<dt> representa o conteúdo da definição <dd> explica o conteúdo

círculo sólido do disco (lista não ordenada)

none não usa marcadores (listas não ordenadas e ordenadas)

círculo círculo vazio (lista não ordenada)

números ideográficos simples cjk-ideográficos

quadrado sólido quadrado (lista não ordenada

sistema de numeração georgiano tradicional georgiano

algarismos arábicos decimais

algarismos arábicos decimais à esquerda começando com 0

algarismos romanos minúsculos romanos minúsculos

algarismos romanos maiúsculos

letras minúsculas em inglês

letras maiúsculas em inglês

letras latinas minúsculas minúsculas

letras latinas maiúsculas maiúsculas

hebraicoNumeração armênia tradicional

numeração hebraica tradicional armênia;

dentro: o marcador da lista está localizado dentro do texto

fora: o marcador da lista está fora do texto da lista

a:link{regras de estilo css;}padrão

a:visited{css style regras;} estilo após o hiperlink ser visitado

a:hover{regra de estilo css;}Estilo de hiperlink ao passar o mouse

a:active{regras de estilo css;} estilo de hiperlink quando o mouse é clicado e mantido pressionado

border define a borda da tabela (o padrão border="0" é sem borda) border-collapse: colapsar mesclagem de borda border-collspacing define a distância entre células adjacentes

cellpacing define o espaço entre as células

cellpadding define o espaço entre o conteúdo da célula e as bordas da célula

largura define a largura da tabela

height define a altura da mesa

alinhar define o alinhamento horizontal da tabela na página da web

bgcolor define a cor de fundo da tabela

background define a imagem de fundo da tabela

height define a altura da linha

alinhar define o alinhamento horizontal de uma linha de conteúdo na página da web

valign define o modo vertical de uma linha de conteúdo

bgcolor define a cor de fundo da linha

plano de fundo define imagem de plano de fundo da linha

largura define a largura da célula

height define a altura da célula

alinhar define o alinhamento horizontal das células na página da web

valign define o padrão vertical do conteúdo da célula

bgcolor define a cor de fundo da célula

backgroundDefinir imagem de fundo da célula

colspan define o número de colunas abrangidas pelas células (usado para mesclar células orientadas horizontalmente)

rowspan define o número de linhas que a célula abrange verticalmente (usado para mesclar células orientadas verticalmente)

<thead> define o cabeçalho da tabela localizado na tag da tabela

<tfoot>O cabeçalho e rodapé usados ​​para definir a tabela estão localizados após o cabeçalho

<tbody> define o tema da mesa

da sintaxe do elemento de formulário: <from> controle de formulário</from>

ação especifica o endereço de destino para envio de dados

método método de solicitação de dados get /post get significa que o navegador estabelece uma conexão com o servidor de formulário e a transmite diretamente, o que é menos seguro. Postar significa que o navegador estabelecerá um link para o formulário especificado no atributo action e depois o transmitirá em partes, o que é mais seguro.

name é usado para especificar um nome para o formulário

<input type="Tipo de controle"/ >

tipo

controle de área de texto

selecione o controle

O atributo autocomplete é usado para especificar se o formulário possui uma função de preenchimento automático, o que significa que o conteúdo de entrada do controle do formulário é registrado e o histórico de entrada será exibido na lista suspensa quando inserido novamente.

O atributo novalidate especifica o cancelamento da verificação de validade do formulário quando o formulário é enviado. Após definir este atributo para o formulário, a validação de todo o formulário é desativada. ="novalidar"

O tipo de email <input type="email"> é uma caixa de texto especialmente usada para inserir endereços de email.

O tipo de URL <input type="url"> é uma caixa de texto especialmente usada para inserir endereços de URL.

O tipo tel <input type="tel"> é uma caixa de texto especialmente usada para inserir números de telefone.

Tipo de pesquisa <input type="search"> é uma caixa de texto especialmente usada para inserir palavras-chave de pesquisa

O tipo de cor <input type="color"> é uma caixa de texto especialmente definida para cores

O tipo numder <input type="numder"> é uma caixa de texto especialmente usada para inserir valores numéricos.

O tipo de intervalo <input type="range"> é usado para fornecer um intervalo de entrada de valores dentro de um determinado intervalo.

Tipo de pinkers de data <input type=data, mês, semana...> especifica o tipo de hora e data

O atributo autofocus é usado para especificar se o foco deve ser obtido automaticamente após o carregamento da página (na caixa de entrada)

O atributo form pode escrever os subelementos do formulário em qualquer lugar da página. Você só precisa definir o valor do atributo form do elemento para esta especificação no formulário.

O atributo list especifica o elemento datalist vinculado à caixa de entrada e seu valor é o id de um determinado elemento datalist.

O atributo multiple especifica que a caixa de entrada pode selecionar vários valores. Este atributo é aplicável a email (separados por vírgulas) e arquivo (arquivo).

Os atributos min, max e step são usados ​​para especificar limites para tipos de entrada contendo números ou datas.

O atributo padrão é usado para verificar se o conteúdo inserido na caixa de entrada do tipo de entrada corresponde à expressão regular definida P181

O atributo placeholder é usado para fornecer informações relevantes para a caixa de entrada do tipo de entrada para descrever o que a caixa de entrada espera que o usuário insira.

O atributo obrigatório é usado para determinar se a entrada do usuário na caixa de entrada do formulário está vazia e se o usuário não tem permissão para enviar o formulário.

seletor {float: valor do atributo}

flutuar valores de atributos comuns

Seletor {clear: valor do atributo;}

left não permite rótulos flutuantes à esquerda

direita não permite rótulos flutuantes à direita

ambas as claras flutuam em ambos os lados ao mesmo tempo

rótulo vazio clear float

Seletor {posição: valor do atributo;}

posicionamento automático estático

Posicionamento relativo, posicionamento relativo à posição do fluxo de documentos original

posicionamento absoluto, posicionado em relação à sua tag pai posicionada anteriormente

posicionamento fixo fixo, equivalente ao posicionamento da janela do navegador

O modo de posicionamento de posição é usado apenas para definir como a etiqueta é posicionada e não pode determinar a posição específica da etiqueta.

O deslocamento superior define a distância da etiqueta em relação à borda superior da etiqueta pai.

O deslocamento inferior define a distância da etiqueta em relação à borda inferior da etiqueta pai.

leftO deslocamento esquerdo define a distância do rótulo em relação à linha esquerda de seu rótulo pai

deslocamento superior direito define a distância do rótulo em relação à linha direita de seu rótulo pai

Seletor {overflow: valor do atributo;}

O conteúdo visível não será cortado e será renderizado fora da caixa do rótulo

o conteúdo excedente oculto será cortado e o conteúdo cortado ficará invisível

aoto gera barras de rolagem quando necessário e se adapta ao conteúdo que precisa ser exibido.

O atributo z-index ajusta as posições superior e inferior

layout de coluna única

nenhumSem atributos, serão obtidos efeitos excessivos

todosTodos os atributos ganham efeitos excessivos

propriedade define o nome da propriedade css que aplica o efeito excessivo. Vários nomes são separados por vírgulas.

o tempo define a duração do efeito de transição

Curva de velocidade usada para especificar o efeito de transição do atributo de transição

linear especifica um efeito de transição que começa e termina na mesma velocidade, equivalente a cúbico-bezier

facilidade (padrão) começa lentamente, depois acelera e termina lentamente

Efeito de transição fácil que começa lentamente e depois acelera gradualmente

efeito de transição facilitado que termina em velocidade lenta

efeito de transição de entrada e saída que começa em velocidade lenta e termina em velocidade lenta

cúbico-bezier define a forma da curva de aceleração e desaceleração de Bezier por si só

Especifica a hora de início do efeito de transição

transform-functions é usado para definir a transformação

transformar: traduzir(x-... y-...) tradução

transformar:escala(x-... y-...) escala

transformar:inclinação(x-...y-...)inclinação

transformar: girar (ângulo) rotação

Defina sua origem de transformação de ponto central: eixo x eixo y eixo z

rotateX() permite que o elemento especificado gire em torno do eixo X

rotateY() permite que o elemento especificado gire em torno do eixo Y

rotateZ() permite que o elemento especificado gire em torno do eixo Z

rotado3d (x-y-z, ângulo (ângulo de rotação)) configurações abrangentes de atributos

linear especifica um efeito de transição que começa e termina na mesma velocidade

facilidade (padrão) começa lentamente, depois acelera e termina lentamente

Efeito de transição fácil que começa lentamente e depois acelera gradualmente

a animação de atenuação termina em baixa velocidade

efeito de transição de entrada e saída que começa em velocidade lenta e termina em velocidade lenta

bezier cúbico (n,n,n,n) define você mesmo a forma da curva de aceleração e desaceleração de Bezier