Como definir a ah com base na aula

Como definir a ah com base na aula
““:flutuar”É um dos pseudo-classe mais populares que é usado para adicionar efeito a qualquer elemento no mouse ou cursor. É reconhecido apenas na folha de estilo CSS, o que significa que não pode ser aplicada em CSS embutido. Para aplicar ": pairar" no elemento, é melhor atribuir o atributo de classe ou identificação ao elemento e utilizar essa pseudo-classe à folha de estilo para adicionar o efeito do pairar.

Este tutorial explicará:

  • O que é "a: pairar" no CSS?
  • Como definir "A: Passe o Passe" com base na aula?

O que é "a: pairar" no CSS?

““A: Passe o mouse”É usado para adicionar um efeito de pairar nos links incorporados ou na tag âncora. Aqui, “A: Passe o Passeio” inclui tags de ancoragem “"E": pairar "pseudo-classe. Geralmente é usado para acionar o elemento "" no CSS. Ele também pode adicionar efeitos ao elemento "A", alterando a cor do link, o estilo do cursor, a cor de fundo e muito mais.

Como definir "A: Passe o Passe" com base na aula?

Pôr "A: Passe o mouse”Com base na aula, experimente as instruções fornecidas.

Etapa 1: faça um recipiente "div"

Inicialmente, crie um contêiner com a ajuda do “”Tag e atribua -o a um“eu ia”Atributo.

Etapa 2: crie outro contêiner "div"

Em seguida, crie um aninhado “div”Contêiner entre o primeiro contêiner e atribua um“aula”Atributo com um nome específico.

Etapa 3: Insira “” tag

Em seguida, insira o “”Tag que é utilizada para vincular uma página a outra. Em seguida, insira o atributo mencionado dentro da etiqueta de abertura "", onde:

  • ““aula”É utilizado para identificar exclusivamente o elemento com um nome.
  • ““Href”O atributo é usado para manter o URL de outra página ou endereço de destino:


Página principal
Lar
sobre mim

A saída do código acima é o seguinte:

Etapa 4: estilo o contêiner "div" principal

Para estilizar o principal contêiner "div", antes de tudo, acessar o "”Elemento por nome de identidade com o“#”Seletor. No nosso caso, usamos “#Main-Div”. Em seguida, aplique as propriedades abaixo da listada:

#main-div
borda: 3px azul sólido;
Margem: 20px 50px;
preenchimento: 50px;
tamanho de fonte: maior;
Background-Color: Bisque;

Aqui:

  • O "fronteira”A propriedade é usada para definir um limite ou esboço ao redor do elemento.
  • ““margem”Aloca um espaço fora do limite definido.
  • ““preenchimento”É usado para especificar o espaço dentro do limite definido e ao redor do conteúdo do elemento.
  • ““tamanho da fonte”A propriedade determina o tamanho da fonte.
  • ““cor de fundo”É utilizado para definir a cor na parte traseira do elemento dentro de um limite.

Saída

Etapa 5: Defina “A: Passe o Passe" com base na aula

Agora, acesse o interior “div”Elemento usando a classe designada com seletor de pontos“.menu principal”E utilizar o“A: Passe o mouse”Pseudo -aula para adicionar um efeito de pairar ao“" elemento.

Para esse fim, aplique as propriedades mencionadas:

.Menu Mainu A: Hover
Cor: RGB (247, 137, 12);
borda: 2px azul pontilhado;
Radio de fronteira: 20%;

Aqui está a descrição do código mencionado acima:

  • ““cor”A propriedade é utilizada para definir a cor do texto.
  • ““fronteira”Define um limite em torno do“" elemento. Por exemplo, aplicamos uma fronteira azul pontilhada no passeio.
  • ““Radio de fronteira”Define as bordas do elemento em forma arredondada:

Isso se tratava de definir: Passe o mouse com base na classe no CSS.

Conclusão

Para definir o “A: Passe o mouse”Pseudo-classe com base na classe, primeiro, crie um contêiner de div usando o“”Tag e atribua um atributo de classe. Então, insira um “”Elemento para vincular outra página da web. Depois disso, acesse o elemento "div" com a ajuda da classe e aplique o efeito do pairar no link usando "a: pairar". Esta posta.