Creazione dropdown list box

ytreka

il 14 nov 2019, 14:11

7 risposte

ytreka

Utente Attivo

Iscritto da: nov, 2019

Messaggi:: 72

Creazione dropdown list box

14 nov 2019, 14:52

Salve a tutti, ho come compito quello di creare un form per un sito web di fantasia. Vorrei inserire in esso 3 drop down list box...ed effettivamente sono riuscito a farlo, il problema è che le opzioni del menù a tendina sono tutte visibili. Ho visto vari tutorial sui menù a tendina, ma costruiscono il menù in maniera diversa: cioè con <ul> e <li>, nonostante provi ad integrare le due cose, aggiungendo, per quanto riguarda i CSS, display:none, il risultato non cambia. Come posso fare in modo che le opzioni vengano visualizzate solo cliccando il pulsante del menù? Grazie in anticipo a chi mi aiuterà...ecco una porzione di codice:

 <li>Scegli tipo di abbonamento </li>
        <ul>
            <select size="3"required>
            <li> <option class="voci" value="num1">Num1</option></li>
            <li> <option class="voci" value="num2">Num2</option></li>
            <li> <option class="voci" value="num3">Num3</option></li>
            </select>
     </ul>

7 Risposte

Acid
Utente Attivo
Iscritto da
lug, 2018
Messaggi:
129
Re: Creazione dropdown list box
14 nov 2019, 15:39
No, hai mescolato un po di tag, ti consiglio di ripassare la parte riguardanti i campi dei form

per fare una select list si fa così:
```
<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
```
Y
ytreka
Utente Attivo
Iscritto da
nov, 2019
Messaggi:
72
Re: Creazione dropdown list box
14 nov 2019, 15:45
Facendo così il problema è che mi visualizza tutte le opzioni.
Acid
Utente Attivo
Iscritto da
lug, 2018
Messaggi:
129
Re: Creazione dropdown list box
14 nov 2019, 16:46
E allora molto probabilmente hai sbagliato qualche regola in css.
Puoi postare sia il css che l'html, così vediamo?

ytreka

Utente Attivo

Iscritto da: nov, 2019

Messaggi:: 72

Re: Creazione dropdown list box

14 nov 2019, 17:10

Questo è il codice html

<p>Scegli tipo di abbonamento </p>
            <select class="dropdown" size="3" required>
            <option class="voci" value="num1">Num1</option>
            <option class="voci" value="num2">Num2</option>
            <option class="voci" value="num3">Num3</option>
            </select>

Questo il relativo css delle classi "dropdown" e "voci"

 .dropdown:hover {
    background-color: white;
    display: block;
    
}
.dropdown {
    position: absolute;
    background-color: lightgrey;
    min-width: 20px;
    }
    .voci {
  display: block;
    
}

Ho provato varie configurazioni, evidentemente sbagliate anche quelle. E' la prima volta che lavoro con html e css e mi sto trovando molto in difficoltà, anche considerando il fatto che non so dove studiare le nozioni principali di css.

Acid
Utente Attivo
Iscritto da
lug, 2018
Messaggi:
129
Re: Creazione dropdown list box
15 nov 2019, 09:41
Ok, ho capito.
è il "size="3" che permette di decidere quanti elementi visualizzare, se lo togli, vedrai che funziona
Y
ytreka
Utente Attivo
Iscritto da
nov, 2019
Messaggi:
72
Re: Creazione dropdown list box
15 nov 2019, 10:28
Perfetto Stavo impazzendo per una cosuccia del genere...Grazie mille ! Ma sai dove posso trovare una guida che mi faccia capire meglio come funzionano tutti gli attributi di css? Sono importantissimi, ma sono anche una valanga.
Acid
Utente Attivo
Iscritto da
lug, 2018
Messaggi:
129
Re: Creazione dropdown list box
15 nov 2019, 11:18
Guarda, io 15 anni fa avevo studiato l'html su html.it, ma ti consiglio di prenderti un libro, così almeno ce l'hai sempre sottomano se serve.

te ne lascio alcuni che consiglio sempre:

Devi accedere o registrarti per scrivere nel forum

7 risposte