Jump to content
Fórum Script Brasil
  • 0

Style


vulmarjunior
 Share

Question

Olá eu tenho um style que uso na minha página que faz com que os liks fiquem sublinhados quando o mouse passa por cima dele. Até ai tudo bem, só que esse style vale para qualquer link da página. Por exemplo a cor basica dos links é branco, então todos os links naquela pagina serão brancos, só que há links que quero por que estão numa região de fundo branco.

Existe algum modo de criar cores diversificadas para links na mesma página.

Ex: No menu eles são brancos mas no corpo da página são pretos.

Desde já grato pela ajuda

Link to comment
Share on other sites

10 answers to this question

Recommended Posts

  • 0

Cara se não me engano você pode fazer assim:

.menu { font-family : Verdana: font-size : 8pt; color : #000000; }

.menu:link { font-family : Verdana: font-size : 8pt; color : #004080; }

.menu:hover { font-family : Verdana: font-size : 8pt; color : #004080; }

.menu:visited { font-family : Verdana: font-size : 8pt; color : #004080; }

Isso é para class="menu"

Para criar os outros links dinâmicos é só mudar o nome da class que está em negrito, e colocar a fonte, tamanho, etc...

Deu certo?, se deu ou não deu posta ai pra ve se eu posso te ajudar.

Espero ter te ajudado. :P

Link to comment
Share on other sites

  • 0
Cara se não me engano você pode fazer assim:

.menu { font-family : Verdana: font-size : 8pt; color : #000000; }

.menu:link { font-family : Verdana: font-size : 8pt; color : #004080; }

.menu:hover { font-family : Verdana: font-size : 8pt; color : #004080; }

.menu:visited { font-family : Verdana: font-size : 8pt; color : #004080; }

Isso é para class="menu"

Para criar os outros links dinâmicos é só mudar o nome da class que está em negrito, e colocar a fonte, tamanho, etc...

Deu certo?, se deu ou não deu posta ai pra ve se eu posso te ajudar.

Espero ter te ajudado. :P

Complementando, depois tu utiliza com

<a href="pagina.htm" class="menu">Link</a>

Acho que é mais ou menos isso...

Link to comment
Share on other sites

  • 0

Agora ficou completo veja:

<HTML><HEAD>

<TITLE>Links Dinâmicos</TITLE>

<STYLE>

.menu { font-family : Verdana: font-size : 8pt; color : #000000; }

.menu:link { font-family : Verdana: font-size : 8pt; color : #004080; }

.menu:hover { font-family : Verdana: font-size : 8pt; color : #004080; }

.menu:visited { font-family : Verdana: font-size : 8pt; color : #004080; }

</STYLE>

</HEAD><BODY>

<!--- Assunto da página --->

<a href="pagina.htm" class="menu">Link</a>

<!--- Assunto da página --->

</BODY></HTML>

Fui...

Link to comment
Share on other sites

  • 0

Só pra acabar:

Você pode criar várias classes(Ex.: menu1, menu2, ...) e assim você da uma classe para cada link, assim você faz uma classe em especial pra cada um de teus links e seu problema fica solucionado. iuppp!!! hehe....

Link to comment
Share on other sites

  • 0

Desculpa ae a ignorância do macaco aqui :lol: , mas eu não acertei fazer o negócio direito.

Na verdade eu acertei em parte. Eu consegui criar dois diferentes tipos de cores p/ o link, mas a decoração(sublinha, desublinh o link) não aparecia mais.

A baixo eu coloquei o style que eu uso se algém puder me dizer como faço isso que vocês disseram ai nele, ficarei muito grato.

<style>

<!--

body {font-family: Tahoma, Arial; font-size: 12px;}

form {font-family: Tahoma, Arial; font-size: 11px;}

td {font-family: Tahoma, Arial; font-size: 11px;}

.title {font-family: Verdana; font-size: 18px;font-weight: bold;}

hr{line-height: 1px; border : thin inset 1px;}

.text_2 {font-family: Tahoma, Arial; font-size: 12px;}

.text_1 {font-family: Tahoma, Arial; font-size: 10px; line-height: 10px; color: Black;}

.bt {font-size:11px}

a {text-decoration: none;}

a:link {color: #FF6600;}

a:visited {color: FF900;}

a:hover {color: #FF6600; text-decoration: underline;}

//-->

</style>

VALEU :D :lol: B)

Link to comment
Share on other sites

  • 0

Salve como (dinamico.html) e veja no IE, para entender melhor.

<HTML><HEAD>
<TITLE>Links Dinâmicos</TITLE>
<STYLE>

body { font-family: Verdana; font-size : 8pt; color : #000000; }

.menu01:link { font-family: Verdana; font-size : 8pt; color : #0000FF; text-decoration: none;}
.menu01:visited { font-family: Verdana; font-size : 8pt; color : #000000; text-decoration: none;}
.menu01:hover { font-family: Verdana; font-size : 8pt; color : #FF0000; text-decoration: underline;}

.menu02:link { font-family: Verdana; font-size : 8pt; color : #AAAAAA; text-decoration: underline;}
.menu02:visited { font-family: Verdana; font-size : 8pt; color : #000000; text-decoration: underline;}
.menu02:hover { font-family: Verdana; font-size : 8pt; color : #008000; text-decoration: none;}

</STYLE>
</HEAD><BODY>


<a href="dinamico.html" class="menu01"><b>Menu 01</b></a> (Antes: <font color=#0000FF><b>Azul</b> & <b>"Sem" Subilinhado</b></font>) & (Depois: <u><font color=#FF0000><b>Vermelho</b> & <b>Subilinhado</b></font></u>) <br><br>
<a href="dinamico.html" class="menu02"><b>Menu 02</b></a> (Antes: <u><font color=#AAAAAA><b>Cinza</b> & <b>Subilinhado</b></font></u>) & (Depois: <font color=#008000><b>Verde</b> & <b>"Sem" Subilinhado</b></font>) <br><br>
<br><br>



O "link" é o link antes do mouse passar.<br>
O "visited" é link depois de clicado.<br>
O "hover" é o link quando o mouse está em cima do link.<br><br><br>

Para mudar a "Fonte" mude: (font: A fonte que você quer)<br>
Para mudar a "Cor" mude: (color: A cor que você quer")<br>
Para mudar o "Tamanho" mude: (font-size: O tamanho que você quer)<br>
Para mudar a "Estética" mude: (text-decoration: O que você quer, como Sem Sublinhado, Subilinhado)<br><br><br>


O "text-decoration" assim:<br><br>

underline = Sublinhado<br>

none = Sem Sublinhado<br>



</BODY></HTML>

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share



  • Forum Statistics

    • Total Topics
      150.1k
    • Total Posts
      647.1k
×
×
  • Create New...