problemi onmouseover

**ant_alt** · 20-04-2006, 20:34

scopo cercare di riuscire a validare il sito, sto rifacendo tutte le mie pagine definendo le proprietà delle tabelle tramite css e non tag html come avevo fatto prima..ora xò ho questo problema:
ho pubblicato le due pagine così da chiarire subito il mio questito..

questa pagina deve avere l'effetto onmouseover di questa ..cioè il blu scuro in sfondo deve arrivare al bordo superiore e inferiore.
ho ridotto all'indispensabile i codici html e css così da facilitare tutte le operazioni..

**thomas_anderson** · 20-04-2006, 21:05

<div id="nav">
<ul>[*]item[*]item[/list]
</div>

CSS:

#nav {
margin: 0;
padding: 0;
width: xx;
background: #ffc;
color: #000;
}
ul {
margin: 0;
padding: 0;
list-style: none;
}
li {
height: 0; /* per IE5 */
display: inline;
margin: 0 0.5em; /* distanza fra link standard */
padding: 0;
{

a:link, a:visited {
background: transparent;
color: #000;
margin: 0;
padding: 3px 5px;
font-weight: bold;
text-decoration: none;
}
a:hover {
background: #008;
color: #fff;
}

**ant_alt** · 20-04-2006, 21:29

cosa sono ul e li?

scusami..ma se hai 30 sec di tempo da perdere sarebbe molto chiedere di modificare il mio codice?...
in condizioni normali non te lo chiederei te l'assicuro..ma sono davvero molto provato da questa faccenda..

**Mich_** · 21-04-2006, 09:00

La spiegazione dei tag, la trovi (fatta meglio) in tutti i reference (ad esempio http://www.w3schools.com/tags/default.asp ).
<ul> serve per racchiudere una lista non ordinata.

Se vuoi davvero risparmiare tempo e fare le cose fatte bene, devi usare i marcatori per il loro significato semantico. Sistemare una pagina con marcatori sbagliati e` un'impresa titanica (e con poco costrutto: alla fine parecchi visitatori non la possono capire - non tutti i browser sono grafici).

**thomas_anderson** · 21-04-2006, 11:03

Tu hai questo codice:

<table border="0" bgcolor="#223d6c" id="menu">
<tr>
<td width="163" height="23" valign="middle" bgcolor="#223d6c"><div class="menu1">
[img]arrow.gif[/img] Home Page [img]arrow.gif[/img] Chi Siamo</div></td>
</tr>
</table>

Innanzitutto elimina l'attributo bgcolor, che esprimerai nel CSS. L'XHTML potrà essere:

<div id="menu>
<ul>[*]Home Page[*]Chi siamo[/list]
</div>

Il CSS:

[FONT=courier new]#menu {
width: 600px; /* se vuoi usare misure fisse */
margin: 0;
padding: 0;
background: #223d6c;
color: #fff;
border: 1px solid #000;
}
#menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#menu li {
display: inline;
float: left;
margin: 0 0.5em;
background: transparent url(arrow.gif) no repeat top left;
padding-left: xx /* dipende dalla larghezza di arrow.gif */
}
#menu a:link, #menu a:visited {
display: block;
float: left;
background: transparent;
color: #fff;
margin: 0;
padding: 3px 0;
text-align: center;
font-weight: bold;
width: 120px; /* varia sempre calcolando la larghezza complessiva di #menu */
text-decoration: none;
}
#menu a:hover {
background: #369;
color: #fff;
}[FONT=courier new]

Se hai problemi chiedi pure. ciao

@Mich_ : per la semantica infatti il W3C ha inserito <nl> per la navigazione.

**ant_alt** · 28-04-2006, 16:45

ho modificato il codice per adattarlo alle mie esigenze..
html

codice:

<body>
<div id="menu">
<ul>[*]Home Page[*]Chi siamo[/list]
</div>


</p>


</p>
</body>

css

codice:

#menu {
width: 500px; /* se vuoi usare misure fisse */
margin: 0;
padding: 0;
background: #223d6c;
border: 0px solid #000;
font-family: Tahoma;
font-size: 11px;
}
#menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#menu li {
display: inline;
float: left;
margin: 0;
padding-left: 0px; /* dipende dalla larghezza di arrow.gif */
}
#menu a:link, #menu a:visited {
display: block;
float: left;
background: transparent;
color: #fff;
padding: 3px 0;
text-align: center;
font-weight: bold; /* varia sempre calcolando la larghezza complessiva di #menu */
text-decoration: none;
padding: 5px;
width: auto;
}
#menu a:hover {
background: #369;
color: #fff;}

xke in dreamweaver la pagina appare così?
il testo è su due righe..e lo sfondo appare come una sola riga di pochi pixel blu..
quali proprietà mancano nei selettori?

**ant_alt** · 28-04-2006, 16:45

ecco come appare in dreamweaver..(ignorate lo sfondo..)

**ant_alt** · 01-05-2006, 17:48

Originariamente inviato da ant_alt
ecco come appare in dreamweaver..(ignorate lo sfondo..)

up

**Mich_** · 02-05-2006, 10:35

IL problema di dreamweaver non e` di competenza di questo forum: e` un problema che riguarda un programma specifico, non il codice della pagina.
Per tali problemi devi rivolgerti al forum software/tuo_SO .

Lascio qui la discussione in quanto la prima parte si riferisce ad alto argomento, invitandoti a postare il nuovo problema nel forum corretto.

Discussione: problemi onmouseover

Strumenti discussione

Ricerca discussione

Visualizza

problemi onmouseover

Permessi di invio