- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- aiuto css
-
aiuto css
buongiorno ragazzi... ho una pagina web inpostata ad avere il testo bianco, link bianchi, rollover #FF9933 e link visitati bianchi...
Ad un ceto punto della pagina vorrei invece un link #006699 con testo link visitato e rollover.... ho impostato una classe in questo modo:<style type="text/css">
a.collegamento:visited{color:#006699;}
</style>
all'interno dell' head e poi nel link ho inseritoclass="collegamento"
Questo funziona ma solo per il link visitato...come faccio per gli altri?
Sapete dirmi come posso dagli tutte le proprietà?
Spero di essermi spiegato bene...grazie
-
@po-lin said:
buongiorno ragazzi... ho una pagina web inpostata ad avere il testo bianco, link bianchi, rollover #FF9933 e link visitati bianchi...
Ad un ceto punto della pagina vorrei invece un link #006699 con testo link visitato e rollover.... ho impostato una classe in questo modo:<style type="text/css">
a.collegamento:visited{color:#006699;}
</style>
all'interno dell' head e poi nel link ho inseritoclass="collegamento"
Questo funziona ma solo per il link visitato...come faccio per gli altri?
Sapete dirmi come posso dagli tutte le proprietà?
Spero di essermi spiegato bene...grazie
vediamo se ho capito bene[html]<style type="text/css">
a.collegamento:link{color:#006699;}
a.collegamento:visited{color:#006699;}
a.collegamento:hover{color:#FF9933;}
</style>[/html]
ti consiglio però di dichiarare le classi in un foglio di stile esterno, e non dentro l'head....il tutto risulterebbe molto più pulito e comprensibile
-
@18andLiFe said:
vediamo se ho capito bene
[html]<style type="text/css">
a.collegamento:link{color:#006699;}
a.collegamento:visited{color:#006699;}
a.collegamento:hover{color:#FF9933;}
</style>[/html]
ti consiglio però di dichiarare le classi in un foglio di stile esterno, e non dentro l'head....il tutto risulterebbe molto più pulito e comprensibileperfetto
Aggiungo solo che per usare un css esterno, devi salvare tutto il codice in un file di testo e poi linkarlo dalla pagina con questo codice:
<link rel="stylesheet" type="text/css" href="nomefile.css">
-
Grazie ragazzi per l'aiuto... però solo un altro piccolo aiutino... ho inserito il codice
[LEFT]<style type="text/css">
a.collegamento:link{color:#006699;}
a.collegamento:visited{color:#006699;}
a.collegamento:hover{color:#FF9933;}
</style>
in un file chiamato css/homeup.csspoi nella pagina (sotto i meta tag) ho messo
<link rel="stylesheet" type="text/css" href="css/homeup.css">
e nel link ho inserito la classe:
<a href="index.htm" class="collegamento" >Home</a>
Il risultato è il nulla..continua a prendere le proprietà della pagina intera...
Sicuramente sbaglio qualcosa...Grazie ancora[/LEFT]
-
Quando crei il file esterno devi omettere le parti in rosso, visto sono già incluse nella pagina principale
<style type="text/css"> a.collegamento:link{color:#006699;} a.collegamento:visited{color:#006699;} a.collegamento:hover{color:#FF9933;} </style>
-
@claudioweb said:
perfetto
Aggiungo solo che per usare un css esterno, devi salvare tutto il codice in un file di testo e poi linkarlo dalla pagina con questo codice:
><link rel="stylesheet" type="text/css" href="nomefile.css"> >``` :ciauz: io preferisco la versione moooooolto cool
<style type="text/css">
@import url(stile.css);
</style>:D :vaiii:
-
@import non viene interpretato correttamente dai browser molto vecchi.
-
@claudioweb said:
@import non viene interpretato correttamente dai browser molto vecchi.
azz fregato
-
grazie mille ad entrambi...adesso funziona tutto... siete grandi....
A presto
-
Ed è proprio per quello che si usa
NN4 non lo capisce. Quindi non legge una mazza del css. E stampa il solo codice. Molto meglio vedere un documento BEN fatto xhmtl strict senza css che vederne uno con i css che si fanno i c***i loro
-
@massy said:
Ed è proprio per quello che si usa
Nel caso di un semplice css che cambia solo i colori di un link, trovo più utile che venga linkato.Se poi il css è molto complesso, chiaramente si può usare import. Magari combinato con un css linkato, giusto per rendere invisibile lo stile più complesso ai browser incompatibili, e lasciare visibile solo quello di base.
-
Appunto...
Tu metti con @import le caratteristiche complesse
e con <link> quelle più semplici
-
Non ho afferrato bene la differenza tra import e <link>.
E poi import dove andrebbe messo? nell'header?
-
Sì.
<head>
titolo
meta
js
<style type="text/css">
@import url(urlfogliodistile.css);
</style>
<head>
-
Ok, ma perchè import sarebbe meglio di link?
-
Allora per prima cosa distinguiamo:
<link rel="stylesheet" type="text/css" href="stile.css"> ```è un link diretto al file css fatto in html. @import è invece un'istruzione che non fa parte dell'html, ma del css. Infatti va inserita in questo modo:
<style type="text/css">
<!--
@import url(stile.css);
-->
</style>Nota questa cosa, possiamo pensare di sfruttare questo difetto a nostro vantaggio. Usando @import per includere fogli di stile molto complessi, che se venissero interpretati dai vecchi browser farebbero solo danni, in quanto non pienamente compatibili. Così invece verranno direttamente ignorati e il documento sarà mostrato come se fosse senza stile. Questo ci garantisce che seppur meno bella, la pagina sarà certamente leggibile. Spesso si fa una cosa. Si usa sia il link che @import. In questo modo si creano più file css esterni. Quelli più semplici, che si è sicuri siano compatibili con i browser vecchi, perchè stabiliscono solo stili del testo, sfondi ecc. vengono linkati direttamente. Quelli più complessi che potrebbero far danni, perchè stabiliscono posizionamento di Div, visibilità ecc. vengono importati con @import. Spero di non aver creato ulteriore confusione, comunque consapevole della poca chiarezza fornisco questo link [http://www.constile.org/tutorial/progettare_con_stile/](http://www.constile.org/tutorial/progettare_con_stile/) (nella parte dedicata alla retro compatibilità)
-
Chiarissimo.
Ora devo solo ampliare un po' di più le mie conoscenze sui CSS per capire meglio quali possono essere visti dai browser vecchi e quali no.