Wie viele Pixel wird ein Raum gleich zu?

Question

Dies ist mein Code:

<div style="position:absolute;top:300px;width:50px;height:50px;background:red;color:black;word-wrap:break-word;">
        <div contenteditable=true>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            aaaaa
            bbbbbbbbbbb
        </div>
</div>

Ich möchte den gesamten Raum in dem div füllen.

Wie viele Pixel ist die  ?

Answer 1

Sie können eine <div> enthält   erstellen und eine id zuweisen. Stellen Sie die Schriftgröße und Attribute. Dann lesen Sie die aktuelle Breite und Höhe mit:

var space=document.getElementById("space");
var height=(space.clientHeight+1)+"px";
var width=(space.clientWidth+1)+"px";

Answer 2

Es hängt von der Schriftart, Größe, etc. Es gibt keine direkte Gleichung / Zahl für Räume Pixel.

Answer 3

Es ist abhängig von der Schriftgröße, weil   ein Leerraumzeichen ist.

Answer 4

Es gibt keine Möglichkeit, diese Frage Ehrlichkeit zu beantworten, da die Größe eines Raumes ändert sich in Abhängigkeit von der Schriftgröße.

Versuchen Sie dieses, das "30px" auf sich ändernde, was Sie wollen.

<div style="position:absolute;top:300px;width:50px;height:50px;background:red;color:black;word-wrap:break-word;">
        <div contenteditable=true style="margin-left: 30px;">
            aaaaa
            bbbbbbbbbbb
        </div>
</div>

Answer 5

Die Antwort wird von der Schriftart ab, die Sie verwenden, und die Stile es gegeben ist. So müssen Sie es dynamisch in der Seite berechnen.

Verwenden Sie Javascript ein div zu erstellen, die von der Seite angezeigt wird (dh links: -4000px;}, das ein Zeichen enthält Stellen Sie sicher, dieses Element den gleichen Text hat als Ihre contentEditable div Styling Die Breite dieses Elements sein sollte.. die Breite des Leerzeichen (stellen Sie sicher, dass Sie nicht mit jeder Polsterung oder Grenzen usw.)

Ich habe nicht versucht, aber das ist, was ich würde versuchen, zuerst.

Answer 6

Sie können verwenden "em" anstelle von "px". Erste gegoogelt Link zu "em": http://www.xs4all.nl/~sbpoley /webmatters/emex.html

Versuchen Sie eine solche Konstruktion

<div style="position:absolute;top:300px;width:{count_of_letters}em; height:50px;background:red;color:black;word-wrap:break-word;">
    <div contenteditable=true>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        aaaaa
        bbbbbbbbbbb
    </div>

Aber besser, diese Idee und die Verwendung CSS-Regeln aus anderen Kommentaren in diesem Thema zu vergessen.

Answer 7

Ein "em" (1 Zeichenbreite) wird oft als 16 x 16 Pixel sein. Natürlich, wenn ein Betrachter Text ändert die Größe, das würde sich ändern.

Ich bin nicht sicher, was Sie versuchen, zu tun, aber wenn Sie nur leeren Raum wollen über Ihrem Text, könnten Sie ein anderes div setzen (für den Text) in Ihrem div und dann ein "margin-top gesetzt: 10em;. "(oder wie viele ems Sie wollen), um den leeren Raum zu schaffen