Wussten Sie, dass die style-und script-tags können gesetzt werden, um display: block?

0
21

Die andere Nacht, Amit Patel erwähnt, dass Sie können script-tags im HTML-anzeigen: block mit CSS und dann Bearbeiten, dass code, der inline mit dem contentEditable Attribut. Dies bedeutet, dass Sie können, dann sehen es alle update-live im browser, während der Eingabe. Kurz nach Marius Gundersen, antwortete Sie, dass Sie können dies tun, mit dem style-tag als gut.

All dies ist so ein komisches Konzept mir, dass musste ich einfach machen eine demo, um zu sehen, ob es geklappt hat:

Finden Sie den Stift contentEditable <style&rt; tags von Robin Rendle (@robinrendle) auf CodePen.

Und das tut er, so seltsam das sein mag! Alles, was Sie tun müssen ist, fügen Sie das contentEditable-Attribut das style-tag und stellen Sie sicher, dass es auf display: block etwa so:

<p>content goes here</p>

<style contenteditable>
p {
Farbe: schwarz;
}
</style>
Stil {
display: block;
}

Warum sollten wir dies tun wollen? Naja, ich bin mir nicht ganz sicher. Aber es ist sicherlich eine nette demo. Dies erinnert mich auch an das immer so bizarre und brilliant demo-Jake Albaugh gemacht eine Weile zurück, die gerade geschieht zu einem meiner Lieblings-Stifte aller Zeiten:

Finden Sie die Pen Stift#PwLXXP von Jake Albaugh (@jakealbaugh) auf CodePen.