Pixelbreite von Monospace-Zeichen

Ich frage mich, ist es möglich, die Pixelbreite eines Zeichens in einer Monospace-Schriftart zu berechnen? Ich verwende Monospace-Fonts, weil ich jedes Zeichen in meinem DIV mit der gleichen Breite belegen muss, aber ich bin mir nicht sicher, wie ich die tatsächliche Pixelbreite davon zuverlässig ermitteln kann. Ich muss die Breite festlegen, um Berechnungen in JavaScript durchzuführen. Hier ist meine CSS:Pixelbreite von Monospace-Zeichen

font-family: monospace; 
font-size: 15px;

Ist das möglich?

Quelle

2013-03-22 TGH

Denken Sie daran, nur weil Sie eine bestimmte Schriftart und Größe angeben, heißt das nicht, dass mein Browser es verwenden wird. –

Haben Sie versucht, eine Monospace-Schriftart aus den @include-Fonts von Google zu verwenden? Ich würde denken, dass dies die gleiche Zeichengröße für alle (unterstützenden) Browser ergeben würde. Sie müssten es trotzdem selbst messen. – Leaf

Der beste Weg, um dies zu tun, ist eine Spannweite von Bildschirm (position: absolute; top: -100px;) mit einem einzelnen Zeichen in ihm zu erstellen. Dann können Sie die Breite der Spanne messen, um die Breite von 1 Zeichen in der Schriftart mit festem Abstand zu erhalten. Stellen Sie sicher, dass padding in der Spannweite auf 0px eingestellt ist, da dies in der Breite enthalten ist.

EDIT: Wenn Sie nur eine Annäherung benötigen, die ex Einheit ist oft hilfreich. 1ex ist die Höhe eines Kleinbuchstabens "x". Dies entspricht oft ungefähr der Breite. Aber es ist nicht genau.

Quelle

2013-03-22 15:53:45 jaypeagi

Technisch gesehen ist die 'offsetWidth'-Eigenschaft wahrscheinlich die beste Einstellung für die Elementbreite. Die '1ex'-Einheit hat keine definierte Beziehung zu der Vorrückungsbreite von Zeichen; B. für Courier New in der Größe 16px beträgt die Vorschubbreite von Zeichen 10px, aber "1ex" ist 7px. –

Ich bin mir nicht sicher, ob es möglich ist, absolut sicher über die Breite oder sogar die Höhe eines Buchstaben, Monospace oder anders über alle Plattformen hinweg zu sein. Das PX-Suffix für Schriftgröße stellt nicht einmal tatsächliche Pixel auf dem Bildschirm dar (werfen Sie einen Blick auf here für weitere Informationen).

Ich vermute, der einzige Weg wäre, eine feste Breite span für jedes Zeichen zu verwenden.

Aus Interesse, bin ich neugierig zu wissen, warum Sie Buchstaben fester Breite benötigen. Kannst du eine JS Fiddle teilen?

Quelle

2013-03-22 15:54:18 po228

Ich habe es funktioniert im Grunde durch Annäherung an eine Breite, aber fragte mich, ob es einen Weg gibt, es genau zu tun – TGH

Pixelbreite von Monospace-Zeichen

Antwort

Verwandte Themen