Nível: Iniciante
Imagine que você acabou de construir a sua página, mas restou um pequenino detalhe. Os seus links ficaram com sublinhado e as suas imagens estão com uma borda azul em volta, isto aparece em todos os navegadores e você não sabe como retirá-los. Webmasters mais experientes provavelmente já sabem retirá-los. Se você, assim como eu, se deparou com o problema de como retirar o sublinhado dos links e a borda azul das imagens, seus problemas acabaram. É possível fazer isto com código HTML (Hyper Text Markup Language) e/ou Folhas de estilos em cascata (CSS – Cascade Style Sheet).
HTML (Hyper Text Markup Language) é a linguagem (código) usada para criar páginas Web.
Folhas de estilos em cascata (CSS – Cascade Style Sheet) é a linguagem (código) usada para modificar a aparência das páginas Web.
Escolha o código abaixo que mais se adequa com as suas necessidades, copie e cole no seu código:
Copie e cole o código abaixo dentro da TAG <IMG> do seu link:
border=”0″ style=’border:0px;padding:1px;’
1. Folha de estilo (CSS) aplicada à página inteira
Copie e cole o código abaixo dentro da TAG <HEAD></HEAD>:
Código para retirar o sublinhado dos links e a borda das imagens:
<style type=”text/css”>
A:link {text-decoration:none}
A:visited {text-decoration:none}
A:active {text-decoration:none}
A:hover {text-decoration:none}
a img {
border-width:0;
}
</style>
2. Folha de estilo (CSS) aplicada somente à própria tag
Copie e cole o código abaixo dentro da TAG <IMG> do seu link:
Código para retirar o sublinhado dos links: style=”text-decoration: none”
Código para retirar a borda das imagens: style=”border-width: 0px;”
Código para retirar a borda das imagens no Blogger: style=’border: 0px; padding: 1px;’
3. HTML aplicado somente à própria tag
Copie e cole o código abaixo dentro da TAG <IMG> do seu link:
Código para retirar a borda das imagens: border=”0″
Imagem: Vivaotux
Updated 24/04/2009: Margarete
Updated 01/03/2009 (links): Gregori Pavan
Updated 01/03/2009 (imagem): Gregori Pavan
Código para retirar a borda das imagens no Blogger:
Procure este trecho no código HTML do seu blogue na aba Layout, Editar HTML.
.post img {
margin-top:0;
margin-$endSide:0;
margin-bottom:5px;
margin-$startSide:0;
padding:4px;
border:1px solid $borderColor;
}
Substitua o “1” em “border:1px solid” pelo 0. Observe:
.post img {
margin-top:0;
margin-$endSide:0;
margin-bottom:5px;
margin-$startSide:0;
padding:4px;
border:0px solid $borderColor;
}
Pronto! Salve as modificações e note que as bordas de todas as imagens dos artigos não existem mais.
Código para retirar o sublinhado dos links no Blogger:
Procure este trecho no código HTML do seu blogue na aba Layout, Editar HTML.
/* Links
———————————————– */
a:link {
color: $mainLinkColor;
}
a:visited {
color:
$mainVisitedLinkColor;
}
a:hover {
color: $mainVisitedLinkColor;
}
a img {
border-width:0;
}
Acrescente “text-decoration: none;“, salve e pronto. Observe:
/* Links
———————————————– */
a:link {
text-decoration: none;
color: $mainLinkColor;
}
a:visited {
text-decoration: none;
color:
$mainVisitedLinkColor;
}
a:hover {
text-decoration: none;
color:
$mainVisitedLinkColor;
}
a img {
border-width:0;
}
Pronto! Salve as modificações e note que o sublinhado de todos os links dos artigos não existem mais.
Margarete
Comentários recentes