10

これは私のコードです:

<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>

div内のすべてのスペースを埋めたい。

は何ピクセル&nbsp;ですか？

4

7 に答える 7

7

<div>を含むを作成し、を&nbsp;割り当てることができますid。フォント サイズと属性を設定します。次に、次を使用して現在の幅と高さを読み取ります。

var space=document.getElementById("space");
var height=(space.clientHeight+1)+"px";
var width=(space.clientWidth+1)+"px";
于 2010-11-26T19:10:33.927 に答える
2

フォント、サイズなどによって異なります。スペースからピクセルへの直接的な方程式/数はありません。

于 2010-11-26T19:03:43.533 に答える
2

&nbsp;は空白文字であるため、フォント サイズに依存します。

于 2010-11-26T19:03:53.057 に答える
1

"em" (1 文字幅) は、多くの場合、16 x 16 ピクセルと見なされます。もちろん、閲覧者がテキストのサイズを変更すると、それは変わります。

何をしようとしているのかわかりませんが、テキストの上に空のスペースが必要な場合は、別の div (テキスト用) を div 内に配置してから、「 margin-top: 10em; 」を設定できます。 (または必要に応じて em をいくつでも) 空白スペースを提供します。

于 2010-11-27T00:38:36.613 に答える
0

フォントサイズによって1スペースの大きさが変わるので、正直この質問には答えようがありません。

これを試して、「30px」を好きなものに変更してください。

<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>
于 2010-11-26T19:05:30.477 に答える
0

答えは、使用しているフォントと指定されたスタイルによって異なります。そのため、ページで動的に計算する必要があります。

Javascript を使用して、ページの外に表示される div を作成します (つまり、1 文字を含む left:-4000px;}。この要素が contentEditable div と同じテキスト スタイルであることを確認してください。この要素の幅は、スペース文字 (パディングやボーダーなどを含めないようにしてください)

私はこれを試したことはありませんが、最初に試したいのはこれです。

于 2010-11-26T19:10:33.033 に答える
0

「px」の代わりに「em」を使用できます。「em」に関する最初のグーグルリンク: http://www.xs4all.nl/~sbpoley/webmatters/emex.html

このような構造を試してください

<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>

ただし、この考えは忘れて、このトピックの他のコメントの CSS ルールを使用することをお勧めします。

于 2010-11-26T19:10:53.437 に答える