Wie kann ich mithilfe von CSS bestimmte Elemente in einem Menü ausblenden?

Ausblenden Elemente in Menüs mit CSS

Frage:

Wie kann ich bestimmte

-Menüs ausblenden? Elemente in einem Menü mithilfe von CSS auf eine Weise, die verhindert, dass sie angezeigt werden, wenn auf das Menü geklickt wird, selbst in Browsern wie Chrome, die die Anzeige nicht vollständig unterstützen: keine für diesen Zweck?

Antwort:

Anstatt sich auf display:none zu verlassen, sollten Sie die Verwendung des versteckten Attributs in HTML5 in Betracht ziehen. Hier ist ein Beispiel:

<select>  
  <option>Option1</option>
  <option>Option2</option>
  <option hidden>Hidden Option</option>
</select>

Erklärung:

• Das versteckte Attribut wird von modernen Browsern unterstützt, einschließlich Chrome und Firefox.
• Im Gegensatz zu „display: none“ verbirgt „hidden“ das Element sowohl auf dem Bildschirm als auch im Optionsmenü, wenn darauf geklickt wird.
• Dieser Ansatz ist semantisch korrekt und kann mit dem Attribut „disabled“ kombiniert werden, um die Interaktivität mit den ausgeblendeten Optionen weiter einzuschränken.

Hinweis:

• Internet Explorer-Versionen unter 11 unterstützen das versteckte Attribut nicht.
• Für eine kleine Anzahl versteckter Optionen kann das alleinige Hinzufügen des versteckten Attributs effizienter sein als die Verwendung anderer Methoden, wie z. B. das Entfernen und erneute Hinzufügen von Elementen oder die Verwendung nicht standardmäßiger Techniken.

Das obige ist der detaillierte Inhalt vonWie kann ich mithilfe von CSS bestimmte Elemente in einem Menü ausblenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!