Heim >Web-Frontend >Bootstrap-Tutorial >So konvertieren Sie px im Bootstrap automatisch in rem

So konvertieren Sie px im Bootstrap automatisch in rem

爱喝马黛茶的安东尼
爱喝马黛茶的安东尼Original
2019-07-13 15:48:525499Durchsuche

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!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn