Dire a <a> di usare lo stesso "color: " del testo

[tsunamin]

ho un sito con cose tipo:

<div class="pippo">
testo
<a>un link</a>
testo
</div>

In pratica agendo sulla proprietà color della classe pippo, posso impostare il colore del testo dentro il div.
Il problema è che i link ha un colore di default che sovrascrive quello impostato da pippo.

Esiste un modo per dire a tutti i tag <a> di un sito di ereditare il colore del testo del contenitore in cui stanno, senza usare il loro colore?

grazie

[Mich_]

Premetto subito che non mi sembra una buona idea, quella di "nascondere" un link. Pero` capisco che potrebbero esserci dei casi particolari.

Interpreto percio` la domanda:
Ho del testo, che puo` avere colori diversi a seconda della posizione nella pagina.
Nelle varie sezioni del testo, ci sono dei link, che vorrei non seguissero i colori di default del browser, ma prendessero il colore del testo "non link" rispettivo.
C'e` un modo per impostare il colore di a e a:hover in modo da non dover definire lo stile del tag specifico per ogni sezione del testo?

Risposta: non lo so; non mi risulta che sia possibile.
Credo sia necessario ridefinire i vari a e a:hover per ciascuna sezione dei vari colori, ridefinendo il colore uguale a quello del testo.

[Leilond]

Di che colore è il testo? Verrà da qualche parte no? Dal body?

Se ad esempio hai questa regola

body {color: #000} 

Puoi sostituirla con

body, body div.pippo a {color: #000} 

In pratica devi occuparti di aggiungere AD OGNI regola che definisce il colore anche una regola per gli <a>

[tsunamin]

Originariamente inviato da Mich_
Premetto subito che non mi sembra una buona idea, quella di "nascondere" un link. Pero` capisco che potrebbero esserci dei casi particolari.

In pratica mi basterebbe mantenere il colore del testo in cui si trova il link, e magari lasciare il testo del link, identico a tutto ciò che gli sta attorno, tranne per il fatto che è sottolineato.

Originariamente inviato da Mich_
Risposta: non lo so; non mi risulta che sia possibile.
Credo sia necessario ridefinire i vari a e a:hover per ciascuna sezione dei vari colori, ridefinendo il colore uguale a quello del testo.

Il mio sito è fatto a tante box (fatte con i <div>), magari una box è verde chiaro e il testo di quella box è verde scuro, una box è rosa chiaro e il testo è rosa scuro.. ecc.

Per far ciò ho fatto in questo modo

<div class="box1 rosa">
...
</div>

<div class="box2 verde">
...
</div>

In pratica così facendo i dati sul colore della box son separati da quella della sua geometria, e nel momento in cui la box1 la voglio far diventare azzurra, con i suo testo in blu scuro, basta che sostituisco "rosa" con "azzurro".

Il problema di sta faccenda sono gli <a>. In pratica io vorrei che ad esempio dove lo sfondo è rosa, il testo degli <a> sia sottolineato e rosa scuro (come anche il testo circostante è rosa scuro) e così via.

Invece se definisco il colore degli <a> nello style.css, quel colore se lo becca l'intero sito.
E provando con due colori "neutri", il bianco non è visibile visto che gli sfondi delle box sono chiari, mentre il nero è un pugno nell'occhio.

Una possibilità sarebbe far una cosa tipo

<div class="box1 rosa">
<a class="a_rosa">uno</a>
<a class="a_rosa">due</a>
</div>

<div class="box2 verde">
<a class="a_verde">uno</a>
<a class="a_verde">due</a>
</div>

Il problema è che nel momento in cui la box2 la voglio far diventare arancione, mi tocca cambiare non solo una stringa, ma tante stringhe per tutti gli <a>

Quindi per me l'idealde sarebbe stato poter dire all'<a> di "ereditare" il colore del testo di dove si trova, e magari mantenere la sottolineatura, per distinguerlo dal testo.

grazie.

[tsunamin]

Originariamente inviato da Leilond
Di che colore è il testo? Verrà da qualche parte no? Dal body?

Se ad esempio hai questa regola

body {color: #000} 

Puoi sostituirla con

body, body div.pippo a {color: #000} 

In pratica devi occuparti di aggiungere AD OGNI regola che definisce il colore anche una regola per gli <a>

Ciao scusa, stavo scrivendo la risposta a mich, e nel frattempo hai risposto anche tu, ho spiegato meglio la mia situazione nella risposta qui sopra, dici che il tuo suggerimento si può anche applicare in quel caso?

grazie.

[Leilond]

<div class="box1 rosa">
<a class="a_rosa">uno</a>
<a class="a_rosa">due</a>
</div>

<div class="box2 verde">
<a class="a_verde">uno</a>
<a class="a_verde">due</a>
</div> 

No, non c'è bisogno!

Se nel tuo css hai questa regola

div.box1_rosa {color: pink} 

Ti basta cambiare la regola in

div.box1_rosa, div.box1_rosa a {color: pink} 

E tutti i tag <a> dentro i div con class "box1_rosa" saranno anch'essi rosa pur lasciando l'html così

<div class="box1_rosa">
<a>uno</a>
<a>due</a>
</div> 

Ricorda che NON DEVI mettere spazi negli id o nei classname

[Mich_]

Per completare la risposta mia, ed integrarla con il suggerimento di Leilond:

<div class="uno">

testo <a ...>link</a> testo</p></div>
<div class="due">

testo <a ...>link</a> testo</p></div>
...


CSS:
.uno { 
  background-color: ...; 
  ... le altre caratteristiche ...
}
.uno, .uno a, .uno a:hover {
  color: ...;  /* qui definisci il colore per tutti gli elementi della classe "uno" */
}
...
a, a:hover {
  text-decoration: underline;
}

Ho usato la calsse, ma se preferisci puoi usare l'id: il concetto non cambia.

Nota: secondo le regole di buona progettazione dei CSS, i nomi devono rispecchiare il contenuto, non la formattazione aspettata. Io ho usato uno, due, .. perche` non conosco il contenuto.
Comunque usare verde, azzurro, ... non e` una buona idea: se poi decidi di cambiare, ti basta cambiare il colore nel CSS, e non devi agire sul coidce HTML.

[tsunamin]

Originariamente inviato da Leilond

<div class="box1 rosa">
<a class="a_rosa">uno</a>
<a class="a_rosa">due</a>
</div>

<div class="box2 verde">
<a class="a_verde">uno</a>
<a class="a_verde">due</a>
</div> 

No, non c'è bisogno!

Se nel tuo css hai questa regola

div.box1_rosa {color: pink} 

Ti basta cambiare la regola in

div.box1_rosa, div.box1_rosa a {color: pink} 

E tutti i tag <a> dentro i div con class "box1_rosa" saranno anch'essi rosa pur lasciando l'html così

<div class="box1_rosa">
<a>uno</a>
<a>due</a>
</div> 

Ricorda che NON DEVI mettere spazi negli id o nei classname

Ci son gli spazi perchè sono due class diverse:
la prima "box1, box2, box3" definisce la geometria del div
la seconda "rosa, azzurro, verde" definisce il colore del div

.box1 {
height: ..;
width:..;
overflow:..;
}

.rosa {
color: ...;
background-color: ...;
}

L'utilità di tenerle separate è che se voglio far diventare azzurro il contenuto della box1, basta che scrivo class="box1 azzurro".

In pratica secondo il tuo ragionamento mi basterebbe cambiare la definizione di rosa, in

box1 {
height: ..;
width:..;
overflow:..;
}

.rosa, .rosa a {
color: ...;
background-color: ...;
}

e poi continuare a chiamare il div in questo modo:

<div class="box1 rosa">
<a>uno</a>
<a>due</a>
</div>

Grazie mille x il suggerimento, appena stasera son a casa lo provo!!

[tsunamin]

perfetto.. funziona!
grazie!!