Carregando...

Como criar um link em CSS

Postado: 29 de outubro de 2022 Tempo de Leitura: < 1 Minuto

Como criar um link simples em Html e CSS

Este tutorial veremos como criar um link com html e css simples e fácil.

Nesta seção, projetaremos uma estrutura com a uma tag e uma class com css, veja abaixo. 

A tag: <a>, e três classes para cada link para inserirmos o link de destino.

Essa tag usaremos para criar três links com html e css.

Vamos Adicionar o HTML

  <a href="#" class="link-simples">Link Simples</a>

  <a href="#" class="link-hover-cor">Link Hover Cor</a>

  <a href="#" class="link-hover-sublinhado">Link Hover Sublinhado</a>

Vamos Adicionar o CSS

Nesta seção, usaremos algumas propriedades CSS para estilizar os LINKS com css.

.link-simples        { color:#0ebbff; text-decoration:none; font-size:1.5em; }

.link-hover-cor       { color:#555555; text-decoration:none; font-size:1.5em; }
.link-hover-cor:hover { color:#0ebbff; }

.link-hover-sublinhado       { color:#0ebbff; text-decoration:none; font-size:1.5em; }
.link-hover-sublinhado:hover { color:#555555; text-decoration:underline; }

Combinando as Duas seções acima Html e Css temos o seguinte Resultado!

Veja o Resultado baixo!

Baixar Código Veja Funcionando

Publicado por: Loop Nerd

245 Visualizações

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Artigos Relacionados