Aggiunta sub-menu

[thebest_ronzo]

Buonasera a tutti, come potrei aggiungere un sub-menu a questo codice?


HTML

<section class="top-bar-section">
    <ul class="right">
      <li class="active"><a href="index.html">Home</a></li>
      <li><a href="chi-siamo.html">Chi Siamo</a></li>
      <li><a href="faq.html">FAQs</a></li>
      <li><a href="services.html">Servizi</a></li>
      <li><a href="contact.html">Contatti</a></li>  
      </ul>
      </li>
    </ul>
  </section>

CSS

.top-bar { background:none; margin-top:20px;}
.top-bar-section ul li { background:none; padding:0px 20px 5px; line-height:0px;}
.top-bar-section ul li:hover:not(.has-form) > a { background:none; color:#454545;}
.top-bar-section ul li > a { color:#454545; font-size:18px;  text-transform:uppercase; font-family: 'ProximaNovaRegular'; }
.top-bar-section li:not(.has-form) a:not(.button) { background:none; padding:20px 0px 15px; line-height:0px;}
.top-bar-section li.active:not(.has-form) a:not(.button):hover { background:none; border-bottom:4px solid #34b1c4; color:#454545;}
.top-bar-section li:not(.has-form) a:not(.button):hover { background:none; border-bottom:4px solid #34b1c4; color:#454545;}
.top-bar-section li.active:not(.has-form) a:not(.button) { background:none; border-bottom:4px solid #34b1c4; color:#454545; padding:20px 0px 15px; line-height:0px;}

Grazie.

[Roby140569]

Nel tuo codice ci sono un </li> ed un </ul> di troppo.

Aggiungo al tuo codice un submenu, poi te lo gestisci come meglio credi.

<section class="top-bar-section">
    <ul class="right">
        <li class="active"><a href="index.html">Home</a></li>
        <li><a href="chi-siamo.html">Chi Siamo</a></li>
        <li>
        <a href="#">Azienda</a>
            <ul>
                <li><a href="primo-link.html">Primo link</a></li>
                <li><a href="secondo-link.html">Secondo link</a></li>
                 <li><a href="terzo-link.html">Terzo link</a></li>
            </ul>
        </li>
        <li><a href="faq.html">FAQs</a></li>
        <li><a href="services.html">Servizi</a></li>
        <li><a href="contact.html">Contatti</a></li>  
    </ul>
</section>

[thebest_ronzo]

Ecco come appare
test.jpg

volevo che al passaggio del mouse apparisse il sub-menu.

[Vincent.Zeno]

qui
https://www.w3schools.com/css/css_navbar.asp
dovresti avere i necessari suggerimenti per realizzare ciò che cerchi, vedi l'esempio a fondo pagina.
nell'esempio puoi sostituire il contenitore con classe "dropdown-content" con una lista.

[Vincent.Zeno]

un'altro bell'esempio è qui:
https://codepen.io/philhoyt/pen/ujHzd

[Roby140569]

Ecco come appare
test.jpg

volevo che al passaggio del mouse apparisse il sub-menu.

Ti ho scritto il codice HTML necessario. Per il resto dovrai lavorare con i CSS.

Segui i link che ti hanno suggerito.