+ Rispondi al messaggio
Visualizzazione dei risultati da 1 a 7 su 7

Come personalizzare questa select?

  1. #1
    Nedved9 non  in linea Scolaretto
    Post
    59
    Like Inviati  
    0
    Like Ricevuti  
    1
    Buongiorno, io ho un problema sulla personalizzzione con css di questa select.


    Con questo codice html, impostato con un div che precede la select e che viene chiuso dopo la select, la select non mi compare da interfaccia, cio proprio non mi appare,se invece apro e chiudo il div prima della select mi compare il men a tendina, ma non riesco a personalizzarlo con css
    html:
    <div class="custom-select" id="Select">	
    								<select id="select">
    									<optgroup value="100" label="Select Project:">
    									</optgroup>
    								</select>
                    </div>
    

    Codice css, con cui per vado a personalizzare il div e non la select, infatti aprendo e chiudendo il div prima della select , la select la vedo ma questa personalizzazione viene di fatto applicata al div e non alla select.
    .custom-select {
      position: relative;
      font-family: Arial;
    }
    
    .custom-select select {
      display: none; /*hide original SELECT element:*/
    }
    
    .select-selected {
      background-color: DodgerBlue;
    }
    
    /*style the arrow inside the select element:*/
    .select-selected:after {
      position: absolute;
      content: "";
      top: 14px;
      right: 10px;
      width: 0;
      height: 0;
      border: 6px solid transparent;
      border-color: #fff transparent transparent transparent;
    }
    
    /*point the arrow upwards when the select box is open (active):*/
    .select-selected.select-arrow-active:after {
      border-color: transparent transparent #fff transparent;
      top: 7px;
    }
    
    /*style the items (options), including the selected item:*/
    .select-items div,.select-selected {
      color: #ffffff;
      padding: 8px 16px;
      border: 1px solid transparent;
      border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
      cursor: pointer;
      user-select: none;
    }
    
    /*style items (options):*/
    .select-items {
      position: absolute;
      background-color: DodgerBlue;
      top: 100%;
      left: 0;
      right: 0;
      z-index: 99;
    }
    
    /*hide the items when the select box is closed:*/
    .select-hide {
      display: none;
    }
    
    .select-items div:hover, .same-as-selected {
      background-color: rgba(0, 0, 0, 0.1);
    }
    
    Vorrei gentilmente chiedere se si possa utilizzare una select direttamente come div o comunque posso risolvere questo problema. Come posso creare una select direttamente come div?
    Ultima modifica di Nedved9; 20-02-2021 12:32 

  2. #2
    L'avatar di Brontolo
    Brontolo non  in linea Very Important Person
    Post
    3,132
    Like Inviati  
    5
    Like Ricevuti  
    4
    Quote Originariamente inviato da Nedved9 Visualizza il messaggio
    ...,se invece apro e chiudo il div ...
    Che significa? C' un qualche codice che mostra/nasconde la div?

    Quote Originariamente inviato da Nedved9 Visualizza il messaggio
    Come posso creare una select direttamente come div?
    Questo non ha senso. Sono due elementi che hanno funzioni completamente diverse, ma del tutto personalizzabili nell'aspetto.
    ℹ️ Leggi di pi su Brontolo ...

  3. #3
    Nedved9 non  in linea Scolaretto
    Post
    59
    Like Inviati  
    0
    Like Ricevuti  
    1
    Quote Originariamente inviato da Brontolo Visualizza il messaggio
    Che significa? C' un qualche codice che mostra/nasconde la div?
    dovrei aver risolto quel problema , per non riesco a personalizzarlo...
    Ad esempio lo sfondo del men a tendina mi appare bianco, come posso impostare questo colore #DEEBEF? cio sualla base del css che ho fatto, mettere il css o non metterlo non vedo differenze, era per quello che pensavo di creare tipo un <div classe=""> che riproduce un men a tendina, cio a me sembra che il css agisca sul div e non sulla select , non so se mi sono spiegato,ad esempio vorrei impostare lo sfondo alla select, ma non capisco come faro apparire del colore desiderato
    Ultima modifica di Nedved9; 20-02-2021 12:34 

  4. #4
    L'avatar di Brontolo
    Brontolo non  in linea Very Important Person
    Post
    3,132
    Like Inviati  
    5
    Like Ricevuti  
    4
    Quote Originariamente inviato da Nedved9 Visualizza il messaggio
    dovrei aver risolto quel problema
    Quale problema? Se preferisci fare un monologo non ti serve un forum.
    ℹ️ Leggi di pi su Brontolo ...

  5. #5
    Nedved9 non  in linea Scolaretto
    Post
    59
    Like Inviati  
    0
    Like Ricevuti  
    1
    Quote Originariamente inviato da Brontolo Visualizza il messaggio
    Quale problema? Se preferisci fare un monologo non ti serve un forum.
    Io sto chiedendo un consiglio, se si pu o meno utilizzare una select come div, e come posso colorare il men a tendina del colore desiderato, non sono qui a fare monologhi di certo, se riesce a darmi risposte/consigli bene, senn visto che un forum, pu anche non rispondermi
    Ultima modifica di Nedved9; 20-02-2021 13:33 

  6. #6
    L'avatar di Brontolo
    Brontolo non  in linea Very Important Person
    Post
    3,132
    Like Inviati  
    5
    Like Ricevuti  
    4
    No,non funziona cos. Tu hai posto ina domanda in modo non chiaro e ti ti ho invitato a chiarire cosa intendevi, in quanto aprire o chiudere una div non significa niente. Tu invece hai preferito andare dritto nella tua pretesa assurda di trasformare un div in un select. Questo il monologo.
    un consiglio che chiedi? Comprati un libro e studia, invece di scopiazzare codice che non comprendi.
    ℹ️ Leggi di pi su Brontolo ...

  7. #7
    L'avatar di _alka_
    _alka_ non  in linea Very Important Person
    Post
    1,391
    Like Inviati  
    0
    Like Ricevuti  
    18
    Quote Originariamente inviato da Brontolo Visualizza il messaggio
    Tu hai posto ina domanda in modo non chiaro e ti ti ho invitato a chiarire cosa intendevi [...]
    ...e questo avviene abbastanza spesso: ad esempio, c' questa discussione del tutto simile che stata abbandonata a s stessa, senza evoluzioni n risposte.
    ℹ️ Leggi di pi su _alka_ ...

+ Rispondi al messaggio

Potrebbero interessarti anche ...

  1. VPN questa sconosciuta
    Da nicolafr nel forum Networking e sicurezza
    Risposte: 12
    Ultimo Post: 18-10-2015, 16:35
  2. Risposte: 1
    Ultimo Post: 05-12-2009, 09:20
  3. [Javascript]Popolare select tramite altro select
    Da Eugene nel forum HTML, CSS e JavaScript
    Risposte: 4
    Ultimo Post: 26-03-2008, 00:36
  4. MSN non funziona questa sera???
    Da onsitus nel forum Altri linguaggi e strumenti
    Risposte: 10
    Ultimo Post: 28-09-2006, 20:10
  5. x questa routine non funziona?
    Da damiano nel forum Microsoft Windows
    Risposte: 1
    Ultimo Post: 16-12-2003, 08:32