Ein cleverer CSS-Debug-Code_CSS/HTML

Die Idee ist sehr einfach, der Code ist sehr prägnant, der Effekt ist gut und es ist ziemlich nützlich (IE erkennt diese Art von fortgeschrittenem Zeug natürlich nicht).

Code kopieren Der Code lautet wie folgt:

* {outline: 2px dotted rot}
* * { Umriss: 2 Pixel gepunktet grün }
* * * { Umriss: 2 Pixel gepunktet orange }
* * * * { Umriss: 2 Pixel gepunktet blau }
* * * * * { Umriss: 1 Pixel durchgehend rot }
* * * * * * { Umriss: 1 Pixel durchgehend grün }
* * * * * * * { Umriss: 1 Pixel durchgehend orange }
* * * * * * * { Umriss: 1 Pixel durchgehend blau }

Es ist leicht zu verstehen, Umrisse in verschiedenen Farben und unterschiedlichen Linientypen zu verwenden, um hierarchische Beziehungen zu kennzeichnen.