CSS não é sublinhado

CSS não é sublinhado

CSS e HTML são combinados para projetar um site criando o conteúdo HTML e adicionando estilo a eles. O CSS permite vários estilos para o conteúdo HTML. Um deles é aplicar o efeito decorativo. Este efeito é principalmente para o elemento de texto. Um texto simples HTML é usado em títulos, parágrafos, listas e links também. Os efeitos aplicados pela propriedade de texto decorados de CSS são as propriedades em negrito, itálico e sublinhado. Neste artigo, falaremos sobre como podemos remover a propriedade sublinhada do texto usado nos links. O conteúdo do link contém o efeito sublinhado por padrão.

Link html:

Um link é o conteúdo HTML usado quando há a necessidade de anexar duas ou mais páginas da web. Se quisermos dar o endereço de outra página da web ou um site em nossa página padrão, usamos 'Link' para criar um link entre as páginas. Para esse fim, a tag HTML âncora é usada.

A propriedade sublinhada é tornar o texto do link destacado ou proeminente. Este recurso sublinhado está embutido quando chegamos aos links.

Exemplo 1: Usando a propriedade de decoração de texto:

Principalmente, encontramos os sites onde os links incorporados nas páginas da web estão sublinhados. Então, usamos um exemplo simples no qual usaremos um link original com um efeito sublinhado e o mesmo link sem a propriedade sublinhada do CSS. Isso é feito através da propriedade de decoração de texto.

Propriedade de decoração de texto:

Uma propriedade CSS é aplicada ao conteúdo HTML para decorá -los. Esses efeitos de decoração incluem cor de texto, efeito sublinhado, ousado, itálico, alinhamento e muitas outras propriedades.

A sintaxe básica desta propriedade é:

1
Decoração de texto: valor; // Valor do tipo de decoração

Mas no caso em que queremos remover todos os efeitos, 'nenhum' é usado no local de valor.

Chegando ao código, usamos um estilo embutido para alinhar todo o conteúdo HTML que mencionaremos no corpo, ao centro da página da web. O primeiro conteúdo HTML é o título

Isso também recebe um estilo em linha para alterar a cor preta padrão para azul. É um código adicional, talvez você não precise usar isso.

1

Outro título é usado que mostrará que o link mencionado após esse título é o original com um efeito sublinhado.

Um link é sempre criado através de uma etiqueta de âncora de HTML. O recurso 'href' é para referência. É a fonte ou o endereço da página da web que será aberta quando pressionarmos o link. Como não estamos adicionando o endereço, deixe o recurso estar vazio por enquanto.

1
Clique em mim, link1

Após esse link, usaremos o
Break Tag para criar uma linha em branco. Então, um título que mostrará que o próximo link não será sublinhado é declarado. Uma etiqueta de âncora é novamente usada. Mas desta vez usamos o ID CSS para ter os efeitos desse ID aplicado ao link. Considerando que todos os recursos do link restantes serão os mesmos.

1
Clique em mim, link2

Agora, usaremos a descrição do estilo interno na seção da cabeça. Depois de adicionar a etiqueta do título, usaremos a declaração de estilo com a descrição do ID que criamos.

Os IDs e as classes de CSs internos e externos contêm os efeitos que especificam apenas os itens HTML nos quais usamos os nomes dos IDs e classes. Por exemplo, a única classe que tem a propriedade de não sublinhar o texto será aplicada apenas à tag âncora que contém o nome do ID, declarado na cabeça.

1
2
3
4
5
#um
Decoração de texto: Nenhum;

O ID conterá o efeito de decoração de texto com o valor 'nenhum'. Este valor eliminará todos os efeitos do conteúdo HTML: fator sublinhado, negrito, itálico ou qualquer cor aplicada a ele.

Agora, feche todas as tags e salve o arquivo com a extensão HTML para executar o arquivo no navegador.

Na execução do arquivo, você verá que dois títulos com dois links são exibidos na página da web. Um link criado sobre fatores padrão sem aplicar o efeito de ID do CSS está sublinhado. Mas o segundo é um link sem sublinhado, porque removemos todos os efeitos através da propriedade de decoração de texto.

Exemplo 2: Propriedade do Hover:

Neste exemplo, uma propriedade hover é usada para remover o efeito do texto sublinhado. O passe é a abordagem de navegar no mouse em direção a um link. Novamente, a propriedade de decoração de texto é adicionada ao código, mas desta vez com o uso do efeito pairar.

Na seção corporal do código, o corpo está novamente alinhado ao centro aplicando o CSS embutido. O cabeçalho é usado e depois uma etiqueta de ancoragem é aplicada.

1
< a href = "#"> Olá, eu sou um link

Agora, usaremos a descrição interna do CSS do link. Desta vez, aplicamos efeitos diretamente ao link em vez de usar o ID CSS. Usando a âncora 'a', um efeito de link e o efeito de pairar são aplicados. Para o 'a' como um link, a decoração de texto é aplicada com o valor sublinhado.

1
2
3
4
5
A: Link
Decoração de texto: sublinhado;

Considerando que, para a propriedade Hover, usaremos o valor da decoração de texto como 'nenhum'. Ao fazer isso, sempre que o mouse for navegado em direção ao link, a propriedade sublinhada será removida.

1
2
3
4
5
A: Hover
Decoração de texto: Nenhum;

Ao aplicar os dois efeitos, a página na carga terá o link sublinhado. Mas ao moundar o efeito sublinhado será removido.

Video playerhttps: // linuxhint.com/wp-content/uploads/2022/07/css-não-sub-line-open-me.MP400: 0000: 0000: 08Use as teclas de seta para cima/para baixo para aumentar ou diminuir o volume.

A saída do conceito de remover o efeito sublinhado é exibida no vídeo. Adicionamos uma pequena seção, na qual o link é criado com efeitos sublinhados. Quando o mouse é navegado em direção ao link, ou quando passamos no link, o efeito sublinhado do link é removido. Novamente, o link aparece quando o mouse navegou.

Além disso, em vez de links que possuem texto sublinhado padrão, também podemos sublinhar qualquer texto através da tag HTML sublinhada .

Conclusão:

O artigo “CSS no sublinhado” é um guia completo para explicar a abordagem usada para remover o efeito sublinhado do texto que já possui a propriedade sublinhada, que é o link HTML. Começamos com uma breve introdução aos links html. Duas abordagens CSS são usadas para explicar o conceito de remoção de efeito sublinhado. O primeiro é o uso direto da propriedade de decoração de texto. Enquanto a segunda metodologia inclui o uso de uma propriedade hover que está indiretamente ligada à propriedade Decoration para exibir ou mostrar o efeito sublinhado no link. Ambos os conceitos são explicados através dos exemplos para exibir o CSS usado para propriedades sublinhadas.