dropsown meny med hälp av CSS?

17 svar · 447 visningar · startad av caze 25 dec. 2001

cazeMedlem sedan sep. 20016 059 inlägg

Frågan25 dec. 2001 15:38#1

Hejsan!

God fortsättning på er allihopa...

Jag undrar hur man gör en dropdown meny utan knapp... alltså man ska komma direkt till det alternativ som man väljer i menyn.... Jag skulle också vilja ha verdana som font och textstorlek 10.

tack på förhand......

------------------
/Caze

Web-TorMedlem sedan nov. 200013 890 inlägg

26 dec. 2001 18:00#2

<form>
  <select onChange="location.href=this.options[this.selectedIndex].value">
  <option value="sidan1.html">Text 1</option>
  <option value="sidan1.html">Text 2</option>
  </select>
</form>

------------------
/Tor
www.tor.nu

cazeMedlem sedan sep. 20016 059 inlägg

26 dec. 2001 20:04#3

tack, men hur fixar man så att det blir verdana och storlek 8 eller 10 i menyn?

------------------
/Caze

SuPeR_ToBBeMedlem sedan mars 2001185 inlägg

26 dec. 2001 20:10#4

------------------
B44Z

cazeMedlem sedan sep. 20016 059 inlägg

26 dec. 2001 20:35#5

vadå <style>
option {font:8pt Verdana;}
</style> var ska det in någonstans..???

------------------
/Caze

jorgenMedlem sedan feb. 20012 412 inlägg

26 dec. 2001 20:39#6

Så här:

inom <head> och </head>

<style type="text/css">
option 
{
font-size: 10px;
font-family: Verdana 
}
</style>

RED: Men ska w3c validator bli glad måste man ange color och backgound-color, och en serif också.

option {
   font-style: normal;
   font-size: 10px;
   color: black;
   background-color: transparent;
   font-family: Verdana, sans-serif
}

------------------
Varför bråka när man kan kramas?

[Redigerat av jorgen den 26 dec 2001]

webbmannenMedlem sedan dec. 1999826 inlägg

27 dec. 2001 16:27#7

Hoppar in i denna tråd eftersom min fråga också gäller dropdown-menyn.

Jag har inte lyckats styla själva selectboxen med dess pil och draglist. Är det så illa att det inte alls går?

Isf varför?? Nån som vet?

/webb

------------------
För nyfikna

cazeMedlem sedan sep. 20016 059 inlägg

27 dec. 2001 16:36#8

Så här har jag nu gjort, och det blir fel...=(((

<html>
<head>
<style type="text/css">
option
{
font-size: 10px;
font-family: Verdana
}
</style>
</head>
<body>
<form>
<select onChange="location.href=this.options[this.selectedIndex].value">
<option value="sidan1.html">Text 1</option>
<option value="sidan1.html">Text 2</option>
</select>
</form>
</body>
</html>

Vad är det som är felet...???

------------------
/Caze

jorgenMedlem sedan feb. 20012 412 inlägg

27 dec. 2001 16:53#9

I NN lär du få använda gamla vanliga <font>, prova formatera select istället:

<style type="text/css"> 
select 
{
font-size: 10px;
font-family: Verdana 
}
</style>

eller

<style type="text/css"> 
.dropdown
{
font-size: 10px;
font-family: Verdana 
}
</style>

<form>
<select onChange="location.href=this.options[this.selectedIndex].value">
<option value="sidan1.html" class="dropdown">Text 1</option>
<option value="sidan1.html" class="dropdown">Text 2</option>
</select>
</form>

------------------
Varför bråka när man kan kramas?

cazeMedlem sedan sep. 20016 059 inlägg

28 dec. 2001 15:15#10

SÅ JA, nu fungerar det=)....thx...

------------------
/Caze

cazeMedlem sedan sep. 20016 059 inlägg

28 dec. 2001 15:17#11

BARA EN SAK TILL=)...... hur fixar man en bakgrunds bild och rollover färg till menyn, så man slipper ha olika beroende på vilka färger man har i windows....

------------------
/Caze

jorgenMedlem sedan feb. 20012 412 inlägg

28 dec. 2001 17:09#12

bakgrund:

<STYLE type="text/css">
   BODY { background: url("bild.gif") }
    </STYLE>

länkar:

<style type="text/css">
a:visited { text-decoration: underline;
	color: #404040;
	background-color: transparent }

a:link { text-decoration: underline;
	color: #444444;
	background-color: transparent }

a:hover { text-decoration: underline;
	color: #cccccc; 
	background-color: transparent }

a:active {  text-decoration: underline;
	color: #cccccc; 
	background-color: transparent }
</style>

mvh Jörgen :)

------------------
Varför bråka när man kan kramas?

cazeMedlem sedan sep. 20016 059 inlägg

28 dec. 2001 17:35#13

Den sista länk koden fungerar inte=(.....(känner mig besvärlig...)

------------------
/Caze

jorgenMedlem sedan feb. 20012 412 inlägg

28 dec. 2001 17:59#14

Hej, fungerar klockrent här. Men det funkar ej i NN.

mvh Jörgen :)

------------------
.: Det är jag som ger svaren och det är Ni som ställer frågorna :.

cazeMedlem sedan sep. 20016 059 inlägg

28 dec. 2001 19:48#15

Om det då fungerade för dig, hur gjorde du då????

------------------
/Caze

jorgenMedlem sedan feb. 20012 412 inlägg

28 dec. 2001 20:01#16

Hej, jag använder exakt den för att styla länkar till min egen sida på adressen:
http://checkit.nu/hundportalen/

enda skillnaden är att jag har det i en extern fil. Visa din kod hur du har skrivit så är det lättare att hitta felet.

mvh Jörgen :)

------------------
.: Det är jag som ger svaren och det är Ni som ställer frågorna :.

[Redigerat av jorgen den 28 dec 2001]

cazeMedlem sedan sep. 20016 059 inlägg

28 dec. 2001 20:07#17

Så här har jag skrivit:

<html>
<head>
<style type="text/css">
select
{
font-size: 10px;
font-family: Verdana
}
</style>
</head>
<form>
<select onChange="location.href=this.options[this.selectedIndex].value">
<option value="sidan1.html" class="dropdown">Text 1</option>
<option value="sidan1.html" class="dropdown">Text 2</option>
</select>
</form>
</html>

------------------
/Caze

jorgenMedlem sedan feb. 20012 412 inlägg

28 dec. 2001 20:49#18

Hej, fattade dig som det var vanliga länkar. Roll-overs får du fixa med DHTML.

------------------
.: Det är jag som ger svaren och det är Ni som ställer frågorna :.