4

私は正確な文字列を持っています:123..

Html ページ(SPAN として)にある場合のように、その長さを確認したい

font-name:arial
font-size:16px;

私は実験をしました：

http://jsbin.com/axezib/edit#preview

それで

<span style="font-family:arial;border:solid 1px red;display:inline-block;font-size:16px;">123..</span>

にレンダリングされます:

ここに画像の説明を入力

とそのプロパティ:

ofcourse * { padding:0px;margin:0px; }

ここに画像の説明を入力

ご覧のとおり、幅は 35、高さは 19 です。(境界線を無視しましょう ...)

ただし、同じ結果を教えてくれる(または教えない) 次のコードがあります。

void Main( )
      {
     string input = "123..";
     FontFamily fontFamily = new FontFamily("Arial");
     Font testFont = new  Font(   fontFamily,   16, FontStyle.Regular,   GraphicsUnit.Pixel);
     Size s = TextRenderer.MeasureText(input, testFont);
     Console.WriteLine("Size: height " + s.Height + ", width " + s.Width);
     Console.ReadLine();
      }

ただし、結果は次のとおりです。

ここに画像の説明を入力

ここで何が欠けていますか？

ありがとう:-)

編集

CSS RESET を追加して html コードを再編集した後- コードは 4 つのブラウザすべてで正確にレンダリングされます。疑問が残ります-なぜc#で同じ結果が表示されないのですか

4

2 に答える 2

2

この特定の Web ブラウザーについてこのパズルを解くことはできますが、利用可能なすべてのブラウザーについて文字列を測定することはできません。さらに悪いことに、多くのオペレーティング システム、ビデオ カード、言語、フォント バージョン、ディスプレイ設定があります。これにより、無数の組み合わせが生成され、テキストが少し異なって表示されます。

Web アプリをテストしている場合は、C# コード (IE など) から Web ブラウザーを実行し、Web ページを読み込み、そこから DOM ノードの測定値を取得します。これが、実際の値を取得できる唯一の方法です。

また、このタスクを簡素化する多くのテスト ツールキットがあります。

于 2012-06-30T11:15:38.677 に答える
2

デフォルトのWindowsフォントレンダリング（およびシステムのデフォルトであるアンチエイリアス、ClearType設定など）でレンダリングされた文字列のサイズを比較し、それをWindowsのブラウザによって行われたレンダリングと比較しようとしているようです。または、独自のフォント レンダリング エンジンを持っていない可能性があります。私の知る限り、Gecko (Firefox) と Webkit (Chrome、Safari) は独自のフォント レンダリングを実装しているため、異なるプラットフォーム間で一貫して HTML/CSS を表示できます。

基本的に、C# コードを一致させることができたとしても、リンゴとオレンジを比較しているので、結果はまったく意味がありません。この記事の「現在の実装」を参照してください。

于 2012-06-30T13:10:17.110 に答える