Visualizzazione dei risultati da 1 a 7 su 7
  1. #1
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875

    cambiare colore di sfondo del dropdown menu di bootstrap

    salve a tutti
    ho necessità di cambiare il colore di sfondo del dropdown menu di bootstrap ma non riesco a capire come fare.

    Ispezionando la pagina con chrome mi dice che la classe è a.dropdown-toggle che pero' non trovo da nessuna parte in nessun file che carico

    Inoltre, sempre dallo strumento di ispezione, mi dice che il file è /inc/bootstrap/css/less/navbar.less:661
    Ma questo file non lo tengo da nessuna parte, forse richiama qualche altro file situato in qualche altra directory?

    Allego l'immagine per chiarezza
    Devo cambiare quel nero che come colore ha #080808 e sostituirlo con un verde

    Allego anche quello che mi esce quando vado ad ispezionare con chrome

    Ho anche provato ad aggiungere una classe in piu' nel mio file stile.css ma ugualmente non riesco a fare quello che voglio.

    Sapreste aiutarmi a sistemare sta cosa?
    Grazie
    Immagini allegate Immagini allegate

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Ciao, si tratta di un file less, per cui il CSS che arriva sulla pagina viene generato dinamicamente attraverso il codice di programmazione (pseudo CSS) presente su quel file.

    Ora, modificare quel file sorgente .less può essere dannoso perché se non si sa esattamente dove mettere le mani si rischia di comprometterne il regolare funzionamento.

    Ti suggerisco invece di aggiungere un tuo css personalizzato, magari includendo il file dopo gli altri css presenti sulla pagina, quindi mettere quella stessa regola, che ti salta fuori dall'ispezione, ma con i valori che preferisci.

    Questa regola di norma dovrebbe sovrascrivere quella già presente.

    Avrai quindi un tuo file del tipo custom-style.css dove metterai una cosa del genere:
    codice:
    .navbar-inverse .navbar-nav > .open > a, 
    .navbar-inverse .navbar-nav > .open > a:focus, 
    .navbar-inverse .navbar-nav > .open > a:hover {
        background-color: #090;
    }
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Utente di HTML.it L'avatar di ninja72
    Registrato dal
    May 2020
    residenza
    -
    Messaggi
    319
    less e sass sono strumenti per ottimizzare la scrittura di css, se non hai dimestichezza utilizza il file css puro e poi minifizza(scusate il termine) il tutto, oppure come dice KillerWorm utilizza un file css custom, nel tuo caso potresti fare cosi :
    codice:
     .nav-item.dropdown.show {
                background-color: #0808;
            }

  4. #4
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875
    ciao,
    si ho utilizzato la soluzione di killerworm e funziona alla grande.

    In effetti non capivo bene cosa fosse quel file less (ed anche sass) visto che non riuscivo a trovarlo nelle directory

    Quindi ho aggiunto il pezzo di codice al mio file custom css ed ora funziona

    Grazie

  5. #5
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875
    solo ora noto che rientrando con chrome, i 3 dropdown del menu li vedo di nuovo verdi appena apro la pagina e non quando ci clicco sopra...
    come mai?

  6. #6
    Utente di HTML.it L'avatar di ninja72
    Registrato dal
    May 2020
    residenza
    -
    Messaggi
    319
    Il codice che ti ho postato funziona su FF, chrome, edge, non ho potuto testarlo su safari ma penso funzioni anche li.

  7. #7
    Utente di HTML.it L'avatar di allin81
    Registrato dal
    Mar 2011
    Messaggi
    1,875
    adesso ho cancellato la cronologia del browser e sembra funzionare tutto bene, nel caso provo anche il tuo codice

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.