24 Lesser-Known HTML Attributes You May Want to Use.
Die meisten waren schon hier im Blog, aber es ist ‘ne schöne Liste.
24 Lesser-Known HTML Attributes You May Want to Use.
Die meisten waren schon hier im Blog, aber es ist ‘ne schöne Liste.
Interessant: Das Globale nonce
-Attribut in HTML. Interessant für alle, die CSP machen.
HTML+CSS: The Double Emphasis Thing
HTML hat seit Kurzem ja ein Dialog-Element. Jetzt bald kommt das Popover-Element. Mehr hier.
Neu: HTML Sanitizer API, und die kommt mit Element.setHTML()
für ein .innerHTML
für untrusted Input.
Aus der Sammlung “HTML-Sachen, die man nicht kennt”, hier noch ein post: Those HTML Attributes You Never Use
WebKit zieht eine gute Bilanz aus dem Bestreben, das Web mehr interoperabel zu machen. In der Liste darunter sind auch ein paar coole, neue Features. Darunter das inert
-Attribut, font-size-adjust
, @starting-style
. Gerade das letzte sieht sehr spannend aus.
Ich finde es schön, dass die Browserhersteller zusammenarbeiten. Wenn man aber liest, auf was die sich so bei der Umsetzung konzentrieren: Das sind größtenteils alles neue Features, die sie am Ende wahrscheinlich eh alle umsetzen würden. Da liegt nicht wirklich der Fokus darauf, die Sachen zu fixen, bei denen die Browser schon länger divergent sind.
@starting-style
ist mittlerweile ganz okay supported (Firefox fehlt noch, 129 kommt aber nächste Woche) und CSS-Sizing mit calc-size
wurde vor 5 Tagen in den Standard gemergt. Chrome wird es in in der nächsten Version releasen, alle anderen Browser nicht. Damit kann man jetzt nach height: auto
animieren und transitionieren.
Mit progressive-enhancement-Techniken kann man es ja trotzdem schon nutzen.
In HTML können manche Elemente ja nicht in anderen enthalten sein. Z. B. darf ein div
nicht in einem span
sein.
Manchmal ist man sich da nicht so sicher. Neulich hab ich auch überlegt, ob ein div
in einem label
sein darf und die Antwort zu finden hat echt gedauert. Hier kann man das nachschauen.
CSS content-visibility
(for React devs).
The
content-visibility
CSS property controls whether or not an element renders its contents at all, along with forcing a strong set of containments, allowing user agents to potentially omit large swathes of layout and rendering work until it becomes needed. It enables the user agent to skip an element’s rendering work (including layout and painting) until it is needed — which makes the initial page load much faster.
MDN.
Chrome baut an einer neuen API, mit der man Content preloaden kann: <script type="speculationrules">
Das img
-Element hat ein decoding
-Attribut, mit dem man sagen kann, ob das Bild asynchron oder synchron dekodiert werden soll.
Gibt’s auch schon länger (Chrome 53, Firefox 63).