Matthias Scharwies: Lesetipp: Tabs in HTML?

problematische Seite

Guten Morgen,

Erinnert ihr Euch noch an unsere Diskussion im Januar, wie man Tabs (aka Registerkarten) in HTML realisieren könnte? Wir haben es damals mit details gemacht:

Heute ein Artikel:

Tabs in HTML? von Brian Kardell, einem „Developer Advocate“ bei Igalia.

Er verwendet ein <spicy-sections>-custom element. Mal schau'n, ob er die verbleibenden Browserhersteller überzeugen kann, dann könnte man auch gleich das dialog-Element implementieren.

Herzliche Grüße

Matthias Scharwies

--
Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
  1. problematische Seite

    Hallo,

    ich hab dazu eine Frage: Was macht dieses Statement (die Codeauszeichnung schluckt das |)

    --const-mq-affordances: [screen and (max-width: 40em) ] collapse | [screen and (min-width: 60em) ] tab-bar;

    und wie hängt das hiermit zusammen?

    [affordance="collapse"] { ...
    
    [affordance="collapse"] { ...
    

    Oder kurz: wie hängen --const-mq-affordances und affordance zusammen?

    Gruß
    Jürgen

    1. problematische Seite

      Hallo JürgenB,

      --const-mq-affordances ist ein custom property, das vom JavaScript-Teil gelesen wird. Es verwendet den Wert für Medienabfragen (matchMedia-Methode).

      Ich habe den Code noch nicht auseinandergenommen und weiß deshalb nicht wie das alles genau zusammenspielt.

      Eine "affordance" scheint ein hochtrabender Begriff für einen UI Baustein zu sein - ich habe das Wort noch nie gehört, mein Wörterbuch kennt es nicht, aber hier kommt es unter "Methodology" vor. Offenbar ein Buzzword der Informatikprofessoren.

      Die CSS Abfragen auf [affordance] suchen dann nach Elementen mit einem affordance-Attribut, das ebenfalls vom JavaScript gesetzt wird.

      Aber einen direkten Zusammenhang zwischen custom property und Attribut gibt es nicht. Sie verwenden nur den gleichen Begriff.

      Rolf

      --
      sumpsi - posui - obstruxi