Heim >Web-Frontend >Bootstrap-Tutorial >So konvertieren Sie px im Bootstrap automatisch in rem
Konvertierung zwischen Rem-Wert und Px in CSS3:
Bootstrap-Standard-HTML{Schriftgröße: 10px;}
rem ist ein relativer Größenwert, der relativ zum Stammelement ist.
Angenommen, wir setzen den Schriftgrößenwert von HTML auf html{font-size: 87,5 %;} (d. h. 14 Pixel).
Verwandte Empfehlungen: „Bootstrap Getting Started Tutorial“
Dann sind die anderen Schriftarten die Werte, die man erhält, indem man den gewünschten Wert durch 14 dividiert
Zum Beispiel ist die Standardgröße des Twentytwelve-Themas 960/14=68,57142857142857rem; 24px von
padding ist 24/14=1,714285714285714rem und so weiter.
Die 14 oben ist eine Variable. Wenn Sie die Schriftgröße des Stammelements HTML auf 62,5 % einstellen, beträgt der Divisor 10. Die Vergleichstabelle sieht wie rechts aus:
Ich weiß nicht, welche Vorteile die Verwendung dieser Rem-Einheit hat, aber wenn Sie 62,5 % als Schriftgröße des Stammelements wählen, besteht die Umrechnung zwischen px und rem darin, px direkt durch 10 zu dividieren rem zu bekommen, was besser ist als em. Es ist viel einfacher. Ich habe immer noch nicht herausgefunden, wie man zwischen em und px konvertiert.
Außerdem wird rem in ie8 und niedrigeren Versionen nicht unterstützt, aber andere Browser unterstützen es. Wenn Sie ie8 und niedrigere Versionen in Betracht ziehen möchten, können Sie einen px und dann einen rem wie die Twentytwelve-Standarddatei festlegen.
Das obige ist der detaillierte Inhalt vonSo konvertieren Sie px im Bootstrap automatisch in rem. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!