Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Dúvida html/css

Galera, agradeço se algúem puder me ajudar! A dúvida é a seguinte: não consigo tirar o sublinhado da tag que contem um link. Segue código html e código css.

<!DOCTYPE html>
<html> 
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>PÃO DE QUEIJO MINEIRO</title>
        <link rel="stylesheet" type="text/css" href="receita.css"/>
     </head>

     <body>
         <nav>
         <table id="destaques">
             <tr>
                 <th>Destaques do mês</th>
             </tr>

             <tr>
                <td class="menu"><a href ="http://www.google.com.br">Torta de Banana</a></td>
            </tr>

            <tr>
                <td class="menu"><a href ="http://www.google.com.br">Torta de limão</a></td>
            </tr>

            <tr>
                <td class="menu"><a href ="http://www.google.com.br">Mousse de cupuaçu</a></td>
            </tr>

            <tr>
                <td class="menu"><a href ="http://www.google.com.br">Brigadeiro de Panela</a></td>
            </tr>
        </table>
        </nav>
        <section id="cabecalho">
         <h1 id="titulo">Pão de Queijo Mineiro</h1>

         <figure>
            <img src="paodequeijo.jpg">
            <figcaption>Figura 1 - Ilustração pão de queijo</figcaption>
        </figure>
        </section>

         <h2>Ingredientes</h2>
             <ul>
                 <li>500 g de polvilho azedo</li>
                <li>1 copo (americano) de água</li>
                <li>1 copo (americano) de leite</li>
                <li>1/2 xícara de óleo</li>
                <li>2 ovos</li>
                <li>100 g de queijo parmesão ralado</li>
                <li>sal a gosto</li>
             </ul>

         <h2>Modo de Preparo</h2>
             <ol>
                 <li>Em uma panela, ferva a água e acrescente o leite, o óleo e o sal</li>
                <li>Adicione o polvilho, misture bem e comece a sovar a massa com o fogo desligado</li>
                <li>Quando a massa estiver morna, acrescente o queijo parmesão, os ovos e misture bem</li>
                <li>Unte as mãos e enrole bolinhas de 2 cm de diâmetro</li>
                <li>Disponha as bolinhas em uma assadeira untada com óleo, deixando um espaço entre elas</li>
                <li>Asse em forno médio (180º C), preaquecido, por cerca de 40 minutos</li>
            </ol>

        <h2>Informações Nutricionais</h2>

        <table id="tb-nutrientes">
            <tr>
                <th>Nutrientes</th>
                <th>Porção(60g)</th>
                <th>%VD</th>
            </tr>

            <tr>
                <td>Valor Calórico(Kcal)</td>
                <td>225,37</td>
                <td>9,01</td>
            </tr>

            <tr>
                <td>Carboidratos(g)</td>
                <td>40,56</td>
                <td>10,82</td>
            </tr>

            <tr>
                <td>Proteínas(g)</td>
                <td>5,97</td>
                <td>8,53</td>
            </tr>

            <tr>
                <td>Gorduras Totais(g)</td>
                <td>4,36</td>
                <td>5,45</td>
            </tr>

            <tr>
                <td>Gorduras Saturadas(g)</td>
                <td>2,71</td>
                <td>10,83</td>
            </tr>

            <tr>
                <td>Colesterol(mg)</td>
                <td>16,68</td>
                <td>5,56</td>
            </tr>

            <tr>
                <td>Fibras Alimentares(g)</td>
                <td>0,30</td>
                <td>0,99</td>
            </tr>

            <tr>
                <td>Cálcio(mg)</td>
                <td>142,21</td>
                <td>17,78</td>
            </tr>

            <tr>
                <td>Ferro(mg)</td>
                <td>0,26</td>
                <td>1,89</td>
            </tr>

            <tr>
                <td>Sódio(mg)</td>
                <td>91,69</td>
                <td>3,82</td>
            </tr>
        </table>
     </body>

cabecalho{

text-align: center;}

titulo{

background-color: #B3A742; padding-right: 120px; text-align: center; }

body { background-color: #F5F0DC; font-family: sans-serif; width: 960px; margin-left: auto; margin-right: auto; }

H2{ border-radius: 15px; background: -moz-linear-gradient(top, #9C6F67 20%, #C7BE9B 80%); background: -webkit-linear-gradient(top, #9C6F67 35%, #C7BE9B 70%); background: -o-linear-gradient(top, #9C6F67 20%, #C7BE9B 10%); background: -ms-linear-gradient(top, #9C6F67 15%, #C7BE9B 5%); padding: 5px; color: #FFFFFF; }

tb-nutrientes{

text-align: center; border: 1px solid black; width: 40%; margin: auto; }

tb-nutrientes th{

background-color: #B3A742; }

destaques{

border: 1px solid black; width: 20%; margin: auto; }

destaques th{

background-color: #B3A742; }

.menu:hover { color: black; background-color: #B3A742; text-decoration: none;

}

figure{ background-color: white; width: 625px; text-align: center; margin: auto; padding: 15px; font-family: 'Comic Sans MS', cursive; border: 1px solid black; box-shadow:5px 5px 3px rgba(0,0,0,0.9); }

figure:hover{ -webkit-transform:rotate(-5deg); -moz-transform:rotate(-5deg);}

nav{ float: left; padding-top: 48px; }

5 respostas

Para fazê-lo, basta definir o seguinte código CSS em seu código :

<style type="text/css"> 
a:link 
{ 
 text-decoration:none; 
} 
</style>

Deu certo amigo?

Bom dia Luiz,

Então, n deu certo (mal a demora). N sei se eu coloquei certo no meu código tb...

Você poderia dar um exemplo?

solução!

Olha como vc está usando id

  <table id="destaques">

faz o seguinte adiciona ao seu css o seguinte código:

#destaques a:link{
 text-decoration:none; 
}

Quando vc utiliza id no seu CSS tem que utilizar o # antes do nome id do seu componente. Assim é só dizer onde deve ser aplicado estilo. Da forma que mostrei qualquer link dentro da sua tabela destaques vai ficar sem sublinhado. Se quiser que só os links do menu fiquem sem o sublinhado faça assim:

#destaques  .menu  a:link{
 text-decoration:none; 
}

Quando queremos refernciar uma classe no css utilizamos '.' e o nome da classe que queremos aplicar o estilo.

Espero ter ajudado.

No seu exemplo como está, as duas formas vão dar o mesmo resultado. Mas aconselho a segunda.

Se vc quiser que todo e qualquer link do seu site não tenha o sublinhado, adicione o seu css o código que o colega indicou.

a:link 
{ 
 text-decoration:none; 
}

Os três exemplos que citei, para implementar ao seu CSS. Basta adicionar ao ao seu arquivo CSS que vai funcionar.

Espero ter ajudado

Matheus cara deu certo aqui mano, copiei teu código e adicionei essa simples linha no teu receita.css:

a:link 
{ 
 text-decoration:none; 
}

Tenta de novo...