associare class al name dell'elemento.. + css dinamico

[thitan]

ciao ragazzi, vi pongo 2 quesiti (evito di aprire 2 tread visto che il primo dovrebbe essere un'inezia da risolvere):

1. se ho ben capito, col class

table.tableGrindGrigio td.codiceSmall a#printMe{font-family: Tahoma, Verdana, Arial, Helvetica;font-size: 10px;text-align:center;color:#993300;text-decoration: none;font-weight: bolder;padding:1;} 

dico che tutti i link che hanno id 'printMe' dentro un td con class 'codiceSmall' nella tabella con class 'tableGrindGrigio' ha quelle definizioni di stile... giusto no?

se io, invece che utilizzare l'id, volessi utilizzare un altro sistema per identificare quel link?
il problema è che avrò diversi link, e non mi piace usare il link..

tipo, se mettessi
<a href="indirizzo.php" name="printMe">
c'è un modo di farglielo prendere? la sintassi # funziona solo con l'id mi pare..



2. è possibile rendere dinamico il css?
cioè, una roba del tipo:

.mioClass(colore, dimensione){font-family: Tahoma, Verdana, Arial, Helvetica;font-size: dimensione;text-align:center;color: colore;text-decoration: none;font-weight: bolder;padding:1;}

e poi nel codice lo richiamo così

<span class="mioClass('#FFFF00', '11px')">

...no, eh?

[Mich_]

dico che tutti i link che hanno id 'printMe' dentro un td con class 'codiceSmall' nella tabella con class 'tableGrindGrigio' ha quelle definizioni di stile... giusto no?

Non esattamente. Definisci lo stile per l'unico oggetto con quell'id che puo` esserci nella pagina, se e` un <a> e se sta dentro un td con class="codiceSmall" che a sua volta stia dentro una table con class="tableGrindGrigio".

In pratica, se quelle condizioni sono verificate, la cosa e` equivalente a scrivere:
#printMe { ... }

Il name non e` riconosciuto dal CSS: in effetti e` una cosa deprecata per quasi tutti i tag (unica eccezione gli elementi all'interno dei form).


Il punto 2 contiene molta fantasia ...

Tramite JS e` possibile rendere dinamico il CSS, conuna delle seguenti sintassi:
document.getElementById('ID_OGGETTO').className = "nuovaClasse";
dove ID_OGGETTO e` l'id dell'oggetto, e nuovaClasse e` un nome di classe gia` definita nel CSS

document.getElementById('ID_OGGETTO').style.color = "#13579b";
document.getElementById('ID_OGGETTO').style.backgr oundColor = "#2468AC";
viene modificato solo la proprieta` specificata (nota la sintassi delle proprieta` che nel CSS hanno il trattino).

[UmaThurman]

Per i link basta usare le classi ivece degli id

HTML:

<a href="indirizzo.php" class="printMe">

CSS:

a.printMe{font-family: Tahoma, Verdana, Arial, Helvetica;font-size: 10px;text-align:center;color:#993300;text-decoration: none;font-weight: bolder;padding:1;}

[thitan]

Originariamente inviato da Mich_
Tramite JS e` possibile rendere dinamico il CSS, conuna delle seguenti sintassi:
document.getElementById('ID_OGGETTO').className = "nuovaClasse";
dove ID_OGGETTO e` l'id dell'oggetto, e nuovaClasse e` un nome di classe gia` definita nel CSS

document.getElementById('ID_OGGETTO').style.color = "#13579b";
document.getElementById('ID_OGGETTO').style.backgr oundColor = "#2468AC";
viene modificato solo la proprieta` specificata (nota la sintassi delle proprieta` che nel CSS hanno il trattino).

bhè si questo lo facevo già, ma andavo a cambiare direttamente la classe

document.getElementById('ID_OGGETTO').className = 'pincopalla';

però così ogni per ogni diversità devo creare uno stile apposito..

...e invece fare come dici te mi si riempirebbe il codice di funzioni. ma credo di essermi spiegato male io: non voglio cambiare gli attributi del class col js, in modo 'dinamico' dentro le pagine, ma al momento di 'stampare' l'html da php.. cioè, se ora faccio:

echo "<a href=\"oggetto1\" class=\"uno\">...</a>";
echo "<a href=\"oggetto2\" class=\"due\">...</a>";
echo "<a href=\"oggetto3\" class=\"tre\">...</a>";

echo "listino2:"

echo "<a href=\"oggetto1\" class=\"uno\">...</a>";
echo "<a href=\"oggetto2\" class=\"due\">...</a>";
echo "<a href=\"oggetto3\" class=\"tre\">...</a>"; 

devo aver definito 3 class diversi...chiedevo se era invece possibile una cosa del tipo:

echo "<a href=\"oggetto1\" class=\"mioClass('#FF0000, 'Tahoma')\">...</a>";
echo "<a href=\"oggetto2\" class=\"mioClass('#00FF00, 'Arial')\">...</a>";
echo "<a href=\"oggetto3\" class=\"mioClass('#0000FF, 'Verdana')\">...</a>";

echo "listino2:"

echo "<a href=\"oggetto1\" class=\"mioClass('#FF0000, 'Tahoma')\">...</a>";
echo "<a href=\"oggetto2\" class=\"mioClass('#00FF00, 'Arial')\">...</a>";
echo "<a href=\"oggetto3\" class=\"mioClass('#0000FF, 'Verdana')\">...</a>"; 

e prendeva tutte le regole del class 'mioClass' cambiano solo il colore e il font..

cioè si è un esempio, chiedevo se era possibile e, mi pare di aver capito di no, le alternative quali potrebbero essere, per rispariare righe di codice css (..stò mica diventando perfezionista/rompiballe? )

bhè, grazie delle risposte

[Mich_]

Ma allora devi risolvere lato server (PHP).
In pratica il PHP che sa cosa ci vuole in quel punto, ci mette la classe corretta (oppure lo stile in linea).

Esempio (in HTML+CSS, come realizzare la cosa inPHP devi chiederlo altrove):

echo "<a href=\"oggetto1\" class=\"mioClass tah_r">...</a>"; 
echo "<a href=\"oggetto2\" class=\"mioClass ari_g\">...</a>"; 
echo "<a href=\"oggetto3\" class=\"mioClass ver_b\">...</a>";

Poi devi definire le classi:
tah_r, ari_g, ver_b
che corrispondano ai tuoi desiderata.
Oppure puoi definire tre classi per ogni oggetto:

echo "<a href=\"oggetto1\" class=\"mioClass tah red">...</a>"; 
echo "<a href=\"oggetto2\" class=\"mioClass ari gre\">...</a>"; 
echo "<a href=\"oggetto3\" class=\"mioClass ver blu\">...</a>";

Oppure ancora puoi usare gli stili in linea:

echo "<a href=\"oggetto1\" class=\"mioClass\" style="font-family: Verdana,sans-serif; color:#FF0000\">...</a>"; 
...

Quest'ultima cosa non piace ai puristi dello stile, in quanto inserisce la formattazione dentro il codice HTML.

[thitan]

ok ma questo

echo "<a href=\"oggetto1\" class=\"mioClass tah red">...</a>"; 
echo "<a href=\"oggetto2\" class=\"mioClass ari gre\">...</a>"; 
echo "<a href=\"oggetto3\" class=\"mioClass ver blu\">...</a>"; 

...ecco questo mi andrebbe bene..ma non capisco, nel foglio di stile devo avere 3 class diversi, chiamati

.mioClass tah red{...}
.mioClass ari gre{...}
.mioClass ver blu{...}

o mi prende il class 'mioClass' e ci mette le definizioni colore e font (e quindi era quello che dicevo io ma sbagliavo la sintassi)?

scusa se son domande sceme ma è il mio primo approccio ai css..

[Mich_]

Attenzione alla sintassi!!

class="uno due tre"
significa che all'oggetto sono assegnate tre classi: nel CSS ci dovra` essere la definizione di tutte tre:

.uno { ... }
.due { ... }
.tre { ... }

Poi a ciascun selettore di classe dovrai assegnare degli stili, che per chiarezza non dovranno essere contradditori, ad esempio ad uno assegni la formattazione standard dei blocchi, ad un altro il font, al terzo il colore (tanto per stare all'esempio di partenza).