collegamenti che cambiano colore

15-07-2004, 17.14.34

non mi ricordo il codice ma esiste... quando si passa con il mouse sopra un collegamento esso cambia colore..

15-07-2004, 17.42.04

Col CSS, per esempio:

a:link { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none; }
a:visited { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none; }
a:active { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none; }
a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font weight:bold }

15-07-2004, 23.01.53

sempre con css.. mi ricordo che si poteva fare semplicemente inserrendo un codice html sensa css

15-07-2004, 23.52.10

al max con javascript

Codice HTML:

<a href="pag.html" onmouseover="this.style.color='red'" onmouseout="this.style.color='black'" style="color:black">ciao</a>

ma coi css e' 3000 volte meglio

16-07-2004, 01.30.27

daccordissimo con dxblade se puoi evitare i javascript EVITALI
i css sono la soluzione migliore e sopra hai un bell'esempio.

16-07-2004, 09.52.37

Allora, Warchaos, ascoltami bene...

Il CSS non è nient'altro che un foglio compilato in html, nel quale imposti tutto quello che vorrai avere nel tuo doc html... tipo: grandezza carattere, formato carattere, stile carattere, colore carattere, colore sfondo ecc. ecc.
Alla fine lo salvi con estensione CSS, poi lo ignori e cominci a lavorare la tua pagina html...
Tra i tag <head> e </head> inserisci:
<link href="nome che hai dato tu.css" rel="stylesheet" type="text/css">

in questo modo la tua pag prenderà tutti gli attributi che hai specificato nel CSS.
Salvi la pag nella stessa cartella dove hai salvato il CSS e il gioco è fatto.
Prova... vedrai che è semplice.
Inoltre, se un domani q.cosa del carattere o lo sfondo o di tutto ciò che hai impostato nel tuo sito non dovesse + piacerti, basterà apportare la modifica al CSS che - magicamente - la stessa sarà automaticamente apportata a tutte le pagine che hai creato richiamando lo stesso (sempre col tag che ti ho messo sopra).
Ti lascio un css semplice come esempio...
Prova a fare quello che ti ho detto e poi fammi sapere...
Se hai bisogno, fai un fischio

ESEMPIO:

/* CSS Document */

BODY {scrollbar-face-color: #5B7EB1;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #003261;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #003261;
scrollbar-track-color: #003261;
scrollbar-arrow-color: #ffffff;}

body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
color: #ffffff;

}

body {
background-color : #000000 }

a:link { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:visited { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:active { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font weight:bold }

16-07-2004, 20.22.00

volendo proprio fare una cosa Molto Grezza nessuno (a parte il buon senso

) vieta di fare un solo link con un colore particolare usando i css all'interno del tag <a>, ovvero

Codice:

<a style="color: #ff0000" href="blabla.it">link</a>

pero' non so esattamente come indicare il colore da usare per la versione hover (ovvero quando ci passi sopra)

gli stili esterni, comunque, sono molto piu' versatili, anche se qualunque css e' meglio di javascript per queste cose.

18-07-2004, 14.51.49

Originalmente inviato da Lilafel

Allora, Warchaos, ascoltami bene...

Il CSS non è nient'altro che un foglio compilato in html, nel quale imposti tutto quello che vorrai avere nel tuo doc html... tipo: grandezza carattere, formato carattere, stile carattere, colore carattere, colore sfondo ecc. ecc.
Alla fine lo salvi con estensione CSS, poi lo ignori e cominci a lavorare la tua pagina html...
Tra i tag <head> e </head> inserisci:
<link href="nome che hai dato tu.css" rel="stylesheet" type="text/css">

in questo modo la tua pag prenderà tutti gli attributi che hai specificato nel CSS.
Salvi la pag nella stessa cartella dove hai salvato il CSS e il gioco è fatto.
Prova... vedrai che è semplice.
Inoltre, se un domani q.cosa del carattere o lo sfondo o di tutto ciò che hai impostato nel tuo sito non dovesse + piacerti, basterà apportare la modifica al CSS che - magicamente - la stessa sarà automaticamente apportata a tutte le pagine che hai creato richiamando lo stesso (sempre col tag che ti ho messo sopra).
Ti lascio un css semplice come esempio...
Prova a fare quello che ti ho detto e poi fammi sapere...
Se hai bisogno, fai un fischio

ESEMPIO:

/* CSS Document */

BODY {scrollbar-face-color: #5B7EB1;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #003261;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #003261;
scrollbar-track-color: #003261;
scrollbar-arrow-color: #ffffff;}

body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
color: #ffffff;

}

body {
background-color : #000000 }

a:link { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:visited { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:active { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font weight:bold }

scusa ma come faccio a creare il file.css?

18-07-2004, 14.56.32

Originalmente inviato da Lilafel

Il CSS non è nient'altro che un foglio compilato in html, nel quale imposti tutto quello che vorrai avere nel tuo doc html... tipo: grandezza carattere, formato carattere, stile carattere, colore carattere, colore sfondo ecc. ecc.
Alla fine lo salvi con estensione CSS, poi lo ignori e cominci a lavorare la tua pagina html...
Tra i tag <head> e </head> inserisci:
<link href="nome che hai dato tu.css" rel="stylesheet" type="text/css">

in questo modo la tua pag prenderà tutti gli attributi che hai specificato nel CSS.
Salvi la pag nella stessa cartella dove hai salvato il CSS e il gioco è fatto.
Prova... vedrai che è semplice.
Inoltre, se un domani q.cosa del carattere o lo sfondo o di tutto ciò che hai impostato nel tuo sito non dovesse + piacerti, basterà apportare la modifica al CSS che - magicamente - la stessa sarà automaticamente apportata a tutte le pagine che hai creato richiamando lo stesso (sempre col tag che ti ho messo sopra).
Ti lascio un css semplice come esempio...
Prova a fare quello che ti ho detto e poi fammi sapere...
Se hai bisogno, fai un fischio

mi servirebbe moltissimo.. che posso mettere nel css? sfodno o colore pagina, carattere anche il menu? .. credo di no

credo comunque che me lo mettero se mi imparo

**NoWhere** · 18-07-2004, 15.07.41

Originalmente inviato da Lilafel

Allora, Warchaos, ascoltami bene...

Il CSS non è nient'altro che un foglio compilato in html, nel quale imposti tutto quello che vorrai avere nel tuo doc html... tipo: grandezza carattere, formato carattere, stile carattere, colore carattere, colore sfondo ecc. ecc.
Alla fine lo salvi con estensione CSS, poi lo ignori e cominci a lavorare la tua pagina html...
Tra i tag <head> e </head> inserisci:
<link href="nome che hai dato tu.css" rel="stylesheet" type="text/css">

in questo modo la tua pag prenderà tutti gli attributi che hai specificato nel CSS.
Salvi la pag nella stessa cartella dove hai salvato il CSS e il gioco è fatto.
Prova... vedrai che è semplice.
Inoltre, se un domani q.cosa del carattere o lo sfondo o di tutto ciò che hai impostato nel tuo sito non dovesse + piacerti, basterà apportare la modifica al CSS che - magicamente - la stessa sarà automaticamente apportata a tutte le pagine che hai creato richiamando lo stesso (sempre col tag che ti ho messo sopra).
Ti lascio un css semplice come esempio...
Prova a fare quello che ti ho detto e poi fammi sapere...
Se hai bisogno, fai un fischio

ESEMPIO:

/* CSS Document */

BODY {scrollbar-face-color: #5B7EB1;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #003261;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #003261;
scrollbar-track-color: #003261;
scrollbar-arrow-color: #ffffff;}

body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
color: #ffffff;

}

body {
background-color : #000000 }

a:link { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:visited { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:active { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font weight:bold }

buono questo esempio ma sarebbe meglio inserire il tag body 1 sola volta e mettere tutti gli attributi lì, quindi

Codice HTML:

 body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-color : #000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #ffffff }

:winkOLD:

x Warchaos, il css lo puoi scrivere tranquillamente con il notepad e scrivi DIRETTAMENTE, ad esempio, il codice riportato da me e basta, senza mettere nessun tag ke usi x le pagine [tipo <html> ecc.] e poi quando vai su 'salva con nome' scrivi ad esempio, pagina.css e il file .css é fatto!!

OLD

ricorda ke con i css puoi fare praticamente tutto!!
ciao!!

18-07-2004, 16.49.31

non mi funziona.... uff non mi riesco ad imparare questi css.. guardate qui http://warchaos.altervista.org/prova.html ho messo tra head e /head
questo <link href="prova.css" rel="stylesheet" type="text/css"> ed prova.css esiste lo creato

18-07-2004, 16.55.56

beh il css funziona, solo che non capisco perche' nella pagina hai riscritto il css :?????:
piuttosto metti qualche scritta e link di esempio cosi' ti rendi conto di che succede

cmq ti consiglio qlk guida da www.html.it o www.weblink.altervista.org

**NoWhere** · 18-07-2004, 18.07.44

Codice HTML:

<p align="center">/* CSS Document */ BODY {scrollbar-face-color:
#5B7EB1; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color:
#003261; scrollbar-3dlight-color: #ffffff; scrollbar-darkshadow-color:
#003261; scrollbar-track-color: #003261; scrollbar-arrow-color:
#ffffff;} body,td,th { font-family: Verdana, Arial, Helvetica,
sans-serif; font-size: 10px; color: #ffffff; } body { margin-left:
0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px;
color: #ffffff; } body { background-color : #000000 } a:link {
font-family: verdana, arial, helvetica, sans-serif; font-size: 10px;
color: #ffffff; text-decoration: none; } a:visited { font-family:
verdana, arial, helvetica, sans-serif; font-size: 10px; color:
#ffffff; text-decoration: none; } a:active { font-family:
verdana, arial, helvetica, sans-serif; font-size: 10px; color:
#ffffff; text-decoration: none; } a:hover { font-family: verdana,
arial, helvetica, sans-serif; font-size: 10px; color: #ffffff;
text-decoration: none; font weight:bold } <STYLE TYPE="text/css"><!--
body  {
	scrollbar-face-color: #0000FF;
	scrollbar-shadow-color: #000000; 
	scrollbar-highlight-color: #3399FF;
	scrollbar-3dlight-color: #0000FF;
	scrollbar-darkshadow-color: #000000;
	scrollbar-track-color: #000080;
	scrollbar-arrow-color: #000000;}
--></STYLE> </p>

ecco il tuo errore!!

devi scriverlo così!

poi ricorda ke se decidi di utilizzare un file.css esterno
non devi mettere anke il css dentro la pagina, basta il
collegamento <link href="prova.css" rel="stylesheet" type="text/css"> :winkOLD:

18-07-2004, 18.25.41

ah funziona ma tu hai detto..

ke se decidi di utilizzare un file.css esterno
non devi mettere anke il css dentro la pagina, basta il
collegamento <link href="prova.css" rel="stylesheet" type="text/css">

in questo caso ho il css sia nell codice che questo <link href="prova.css" rel="stylesheet" type="text/css"> come mai? se tolgo questo
}
a:hover
{
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
text-decoration: none;
font weight:bold
}
a:active
{
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
text-decoration: none
}
a:visited
{
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
text-decoration: none
}
a:link
{
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
text-decoration: none
}
td
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #ffffff
}
th
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #ffffff
}

non dovrebbe funzionare lo stesso? xche nel head ha sempre <link href="prova.css" rel="stylesheet" type="text/css"> grazie per tutto l'aiuto..

19-07-2004, 09.05.41

per favore questultima domanda..

19-07-2004, 10.40.43

Sì, dovrebbe funzionare, anzi funziona...
Prova a controllare di aver messo il nome de css giusto, che lo stesso sia salvato nella stessa cartella della pagina dove devi inserirlo ecc.
Non c'è motivo perché non funzioni...

19-07-2004, 11.08.05

ho provano ma non funge http://warchaos.altervista.org/prova2.html

19-07-2004, 21.22.09

ci sono riuscito quasi solo una cosa

a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font weight:bold }

weight ( cioe la grandezza vorrei che resti invariata quando si passa con mouse..)

19-07-2004, 22.17.46

Non ricordo bene se devi eliminare del tutto l'attributo o se devi mettere
none
al posto di
bold

**NoWhere** · 19-07-2004, 22.38.41

metti none! ;) [anzi, nn metterlo affatto!!]

nn ho capito cosa dicevi sopra... cmq se la cosa ti funzia allora AMEN! [ se hai altri dubbi posta pure!! :winkOLD: ]

19-07-2004, 23.48.52

con none non funziona propio niente

a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font weight:none; }

togliendo tutto nemmeno funziona

a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }

che devo provare piu...

**NoWhere** · 19-07-2004, 23.53.44

gli altri attributi a come li hai impostati?
con quale browser nn ti funzia??

[strano cmq, perchè se togli il font-weight - ke serve per dare il grassetto in genere - nn dovrebbe farti nessun effetto al testo! ..presumo ke lìeffetto ke dici ke cresce dipensa dal fatto ke diventa grassetto!]

20-07-2004, 00.24.05

potete fare di nuovo il codice di un links attivo e visitato colore #C0C0C0
quando si passa con il mouse sopra bianco
ma sensa grassetto..

20-07-2004, 01.02.44

Codice HTML:

a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font-weight:normal; }

font-weight si scrive col trattino
inoltre none non e' un valore valido per questo attributo, puoi scegliere tra:
normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900

20-07-2004, 11.08.04

io non vedo niente voi vedete cambiamenti qui?
http://warchaos.altervista.org/prova.html

prova2.css cioe questa


<html>
<head>
<title>Titolo</title>
<style>
/* CSS Document */

BODY {scrollbar-face-color: #5B7EB1;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #003261;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #003261;
scrollbar-track-color: #003261;
scrollbar-arrow-color: #ffffff;}

body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #ffffff;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
color: #ffffff;

}

body {
background-color : #000000 }

a:link { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:visited { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:active { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; }
a:hover { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; color: #ffffff; text-decoration: none; font-weight:normal; }
body {
scrollbar-face-color: #0000FF;
scrollbar-shadow-color: #000000;
scrollbar-highlight-color: #3399FF;
scrollbar-3dlight-color: #0000FF;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #000080;
scrollbar-arrow-color: #000000;}
-->
body{
cursor: url("http://warchaos.altervista.org/index/iconaprova.cur");
}</style>
</head>
<body>
corpo della pagina
</body>
</html>

**NoWhere** · 20-07-2004, 15.08.22

ahahahahahahahahahahahaahah
ahahahahahahaahahahahahahah
ahahaahahahahaahahahahahaah!

-_-

ovvio, hai impostato il valore di tutti gli a [dei link visitati, attivi, ecc..] in bianco [#FFFFFF]

come dovresti vedere il cambiamento effetto così eh?!! o.O

20-07-2004, 16.01.52

ahahhahahahahahh sono propio imbranato ahahahhahahahha
http://warchaos.altervista.org/prova.html ora funziona non capivo niennte #msdkmvs #250ì29 che ne sapevo ... ehheheehh

20-07-2004, 16.05.32

ultima cosa poi non ti stanco piu :D cosi almeno completo

body {
background-color : #000000 }

non volgio mettere il colore ma lo sfondo
ed voglio aggiungere tipo testo comune
Copperplate Gothic Light si puo?

20-07-2004, 16.47.12

nessuno li sa?

**NoWhere** · 20-07-2004, 16.51.36

Originalmente inviato da Warchaos

ultima cosa poi non ti stanco piu :D cosi almeno completo

body {
background-color : #000000 }

non volgio mettere il colore ma lo sfondo
ed voglio aggiungere tipo testo comune
Copperplate Gothic Light si puo?

background-image: url(nome_file.jpg);

ma nn ho capito la seconda domanda

...sei italiano?? allora parlalo!!!

Discussione: collegamenti che cambiano colore

LinkBack

Strumenti discussione

Display

collegamenti che cambiano colore

Regole di scrittura