Ir para conteúdo
Fórum Script Brasil
  • 0

Como inserir um texto simples entre dois hyperlinks em HTML?


Gabriel Davi Eberhardt

Pergunta

Estou querendo inserir um código no header do meu e-commerce, para facilitar o atendimento, que direcione o usuário para o número ou e-mail (serão dois hyperlinks)

O código está assim:

 

Podemos ajudar?  

<br><u><a href="tel:+554734380390" style="color:white" title=" (47)3438-0390" target="_blank"> (47)3438-0390</a></b><u> </br> ou <a href="mailto:fibra@fibracirurgica.com.br" style="color:white" title="fibra@fibracirurgica.com.br"target="_blank">e-mail!</a></b>

 

Não esta ficando da forma como quero

image.png.68fa0c715cd730248c71d1c0452b1f26.png

 

Perceba os erros: 

-Antes do (47) não tem espaço

-a parte de texto "ou por" está com hyperlink (não quero)

 

Obrigado desde já!

Link para o comentário
Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

  • 0
Em 03/12/2021 em 10:22, Gabriel Davi Eberhardt disse:

Estou querendo inserir um código no header do meu e-commerce, para facilitar o atendimento, que direcione o usuário para o número ou e-mail (serão dois hyperlinks)

O código está assim:

 

Podemos ajudar?  

<br><u><a href="tel:+554734380390" style="color:white" title=" (47)3438-0390" target="_blank"> (47)3438-0390</a></b><u> </br> ou <a href="mailto:fibra@fibracirurgica.com.br" style="color:white" title="fibra@fibracirurgica.com.br"target="_blank">e-mail!</a></b>

 

Não esta ficando da forma como quero

image.png.68fa0c715cd730248c71d1c0452b1f26.png

 

Perceba os erros: 

-Antes do (47) não tem espaço

-a parte de texto "ou por" está com hyperlink (não quero)

 

Obrigado desde já!

Olá amigo, pode simplificar este código
Talvez criar uma DIV para alocar todo conteúdo
Para dar o espaçamento pode colocar um margin-left:5px; 
para remover o hiperlink pode usar o text-decoration:none;

Fiz um exemplo abaixo:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Exemplo</title>

    <style type="text/css">
        #contato{
            width: 300px; height: 50px;
            background-color: brown;
        }

        .txt {
            text-align: center;
            color: aliceblue;
            font-weight: bold;
            font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Sans', Arial, sans-serif;
            font-size: 13px;
            text-decoration: none;
            margin-top:17px; 
            display: block;
            float: left;
            margin-left: 5px;
        }

    </style>



</head>
<body>
    <div id="contato">
        <p> 
           <p class="txt">Podemos ajudar?</p><a class="txt" href="tel:+554734380390"> (47) 3438-0390 </a> <span class="txt">ou</span>
            <a class="txt" href="mailto:fibra@fibracirurgica.com.br"> E-mail </a> 
        </p>
    </div>
   
</body>
</html>


 

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...