Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it L'avatar di Kahm
    Registrato dal
    Dec 2004
    residenza
    Rome
    Messaggi
    3,549

    menu con favicon e label sotto icone

    salve a tutti
    il mio target dovrebbe essere questo:


    attualmente sono fermo al disastro
    ho 2 prove ai quali sto tentando

    codice:
    	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
    	
    
    
    	<div class="btn-group  btn-group-lg" role="group" aria-label="Basic example">
    		 <%-- <a href="#myPanel" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">Open Panel</a>--%>
    		  <button type="button" class="btn btn-secondary"><span class="fas fa-home"></span></button> 
    		   <button type="button" class="btn btn-secondary"><i class="fa fa-book-open"></i></button>
    			<button type="button" class="btn btn-secondary"><i class="fa fa-shopping-cart"></i></button>
    		  <button type="button" class="btn btn-secondary"><i class="far fa-address-card"></i></button>
    	  </div>
    codice:
    	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
    	
     <div class="btn-group-lg form-group"  >
    	   <button type="button" id="btn"  class="btn btn-secondary form-control"><span class="fas fa-home"></span></button> 
    	     <label for="btn">label</label>
    	
    	  	   <button type="button" id="btn2"  class="btn btn-secondary form-control"><span class="fas fa-home"></span></button> 
    	     <label for="bt2n">label</label>
      </div>
    Ultima modifica di Kahm; 15-03-2021 a 11:27
    NN vi diro mai chi sono in realta,
    tutti i miei 3D sono orfani, non insistete per farmi rispondere ai 3D aperti da me

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,676
    Ciao, non so se nel frattempo hai già risolto, comunque posto un esempio di come lo imposterei io:
    codice HTML:
    <!DOCTYPE HTML>
    <html lang="it">
       <head>
          <title>Esempio</title>
          <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
    
          <style>
             .navbar{
                display: flex;
                padding: 0em;
                font-size: 1em;
             }
             .navbar button{
                font-size: inherit;
                padding: .5em 1em;
                display: flex;
                flex-direction: column;
                border: 0;
                cursor: pointer;
             }
             .navbar button i{
                height: 1em;
                margin: 0 0 .5em;
             }
    
             
             /* -------- COLORI -------- */
             
             .navbar                    { background: #940000; }
             .navbar button             { background: transparent; color: #fffa; }
             .navbar button:hover,
             .navbar button.active,
             .navbar button:focus       { color: #fff; }
             
             /* ------------------------ */
             
          </style>
       </head>
       <body>
          <div class="btn-group  btn-group-lg navbar" role="group" aria-label="Basic example">
             <button type="button" class="btn btn-secondary active"><i class="fas fa-home"></i>Home</button> 
               <button type="button" class="btn btn-secondary"><i class="fa fa-book-open"></i>Menù</button>
             <button type="button" class="btn btn-secondary"><i class="fa fa-shopping-cart"></i>Carrello</button>
             <button type="button" class="btn btn-secondary"><i class="far fa-address-card"></i>Io</button>
          </div>
       </body>
    </html>
    Tieni conto che è fatto in 10 minuti per darti giusto uno spunto; è chiaro poi che si possa fare in mille modi diversi.
    Se hai domande chiedi pure.
    Fai sapere, buon proseguimento
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

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.