CSS Pixel verständlich erklärt

[neonprimel]

Einen schönen guten Abend

ich bin auf der Suche nach Artikeln, die den CSS-Pixel im Vergleich zum Hardware-Pixel anschaulich, verständlich oder auch einfach nur ausführlich erklären. (Im besten Fall alles zusammen )

Meine bisherigen Recherchen haben noch nicht ganz dass ausgespuckt, was mich wirklich überzeugt hat.

Deutsch, Englisch oder Französisch ist recht.

Danke Euch vielmals
Philip

 

[Myhar]

AW: CSS Pixel verständlich erklärt

Was soll denn ein CSS Pixel sein? Ein Pixel kommt doch von picture element und ist doch grob gesagt das kleinste mögliche Element aus dem ein Bild besteht?
Bzw. gibt es ja diesen Artikel hier, aber ich gehe davon aus, dass du den bereits kennst. Was ist denn dein konkretes Problem, welches du mithilfe dieser CSS Pixel lösen möchtest?

 

[neonprimel]

AW: CSS Pixel verständlich erklärt

Hallo Myhar

ja, der QuirksMode-Artikel war der vorletzte, den ich diesbezüglich durchgelesen hatte.

Bzgl. CSS-Pixel: Wenn ich im CSS eine Maßangabe mache, z.b.

padding: 5px;

dann sind das eben keine 5 Hardwarepixel, also die, die das Gerät/Monitor als "kleinste Leuchteinheit" darstellen kann, sondern 5 CSS-Pixel als relative Einheit, die unabhängig der Gerätepixel sind. Das wird in dem quirksmode-Artikel am Anfang auch erklärt.

Bislang, bei den "herkömmlichen" Bildschirmen war ein CSS-Pixel in der Regel tatsächlich identisch mit einem Hardwarepixel, aber durch die aufkommenden Retina-Displays, bzw. allgemein die hochauflösenden Smartphone-Bildschirme, ändert sich das gerade rapide, so dass es einen Zoomfaktor von hardware zu CSS-Pixel gibt.

Und diesbezüglich fehlt mir noch das entscheidende "Klick-Moment", nach dem ich gerade suche.

Lieben Gruß
Philip

 

[Myhar]

AW: CSS Pixel verständlich erklärt

Ich glaube, ich verstehe hier etwas nicht ganz. Aber ich habe mich damit auch noch nicht auseinandergesetzt, das Problem hatte ich noch nie. Deshalb einmal das Nachfragen/Beschreiben von mir, ob ich das richtig verstanden habe:
Im 2. Absatz von dem Artikel "What web developers need" wird das Zoomen angesprochen. Ein Element ist zuerst 300px breit, nachher aber nicht mehr. Das ist für mich jetzt auch nicht unlogisch, da hier wie mit einer Lupe vergrößert wird. Das Vergrößern ist mir als Entwickler aber zuerst mal egal, ich muss nur für eine prinzipielle skalierbarkeit sorgen. IE skaliert übrigens in px-Größen angegeben Flächen nicht mit, wenn nur die Schriftgröße verändert wird. Hier sind die 300px immer 300px.

Auch wüsste ich nicht, wieso die retina displays da so ein Problem darstellen sollen? Sind 300px nicht 300px? Es ist wohl schmäler als auf anderen Displays, aber das wundert mich auch nicht (Das display hat ja eine höhere Pixeldichte). Aber was soll hier das Problem sein? Gibt man als Webdeveloper seine Maße nicht in fixen px sondern in % oder em an, dann ist die Breite mehr oder weniger vom User einstellbar, in Abhängigkeit von seiner Schriftgröße. Auch hier sehe ich kein wirkliches Problem.

Also kann ich hier nicht wirklich ein Problem erkennen. Falls mir jemand das Problem aufzeigen kann, bin ich dankbar