Comprensione delle classi CSS applicate ai menu: "più profondo" e "parent"


10

Sto cercando di capire la differenza tra i nomi di classe "più profondi" e "parent" applicati agli lielementi parent in un menu Joomla 2.5 predefinito. Sembrano sempre essere applicati insieme? È sempre un "genitore più profondo", mai l'uno o l'altro per quanto posso vedere?

Per esempio:

<ul class="menu">
<li class="item-108 deeper parent"><a href="https://joomla.stackexchange.com/menu1" >Menu1</a>
    <ul>
    <li class="item-110"><a href="https://joomla.stackexchange.com/menu1/sub11" >Sub11</a></li>
    <li class="item-121"><a href="https://joomla.stackexchange.com/menu1/sub12" >Sub12</a></li>
    <li class="item-122"><a href="https://joomla.stackexchange.com/menu1/sub13" >Sub13</a></li>
    </ul></li>
<li class="item-109 deeper parent"><a href="https://joomla.stackexchange.com/menu2" >Menu2</a>
    <ul>
    <li class="item-130"><a href="https://joomla.stackexchange.com/menu2/sub21" >Sub21</a></li>
    </ul></li>
<li class="item-111 active deeper parent"><a href="https://joomla.stackexchange.com/menu3" >Menu3</a>
    <ul>
    <li class="item-118"><a href="https://joomla.stackexchange.com/menu3/sub31" >Sub31</a></li>
    <li class="item-120 current active"><a href="https://joomla.stackexchange.com/menu3/sub32" >Sub32</a></li>
    <li class="item-131"><a href="https://joomla.stackexchange.com/menu3/sub33" >Sub33</a></li>
    </ul></li>
<li class="item-112"><a href="https://joomla.stackexchange.com/menu4" >Menu4</a></li>
</ul>

Così...

  1. Perché i genitori lihanno classi "più profonde" e "parent" applicate quando c'è un sottomenu? Perché non semplicemente "genitore"?

  2. C'è una situazione in cui uno viene applicato e l'altro no? vale a dire. quando forse "più profondo" viene omesso?

Risposte:


10
  • .deeper viene applicato quando la voce di menu ha un sottomenu (voce)
  • .parent viene applicato se questa voce di menu è padre di un'altra voce di menu

Se si dispone di un menu che mostra tutti i livelli, entrambe le classi vengono applicate a una voce di menu principale. Ma a volte vuoi mostrare solo il primo livello nel menu principale e mostrare gli altri livelli in un menu laterale, ad esempio. .deeper non viene quindi applicato nel menu principale perché ha solo 1 livello.

Questo screenshot modificato dovrebbe aiutare a capire meglio le classi:

menu classi CSS

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.