4

Chrome と FireFox でこの単純な jsfiddle を印刷すると、出力が一致しないことに気付きました。

http://jsfiddle.net/Qrqug/

<input type="text" placeholder="Hello World" />

Google Chrome は「Hello World」テキストを出力するようですが、FireFox は出力しません。

HTML5 仕様を見ると、印刷中にプレースホルダーに対して実行するアクションの説明がありません。

これはブラウザの実装によって異なりますか? それとも、仕様のどこかで定義されていますか? JavaScript、CSS、または HTML を使用して FF にプレースホルダーを印刷させる方法はありますか?

これは、CutePDF に印刷するときに FireFox がレンダリングしないことです。物理プリンターに印刷してもレンダリングされないことを確認できますが、私の言葉を信じる必要があります。

ここに画像の説明を入力

Google Chrome は次のとおりです。

ここに画像の説明を入力

4

2 に答える 2

3

まず最初に、次の記事をご案内したいと思います 。あまり良い考えではないかもしれません。

もちろん、すべてのブラウザーでプレースホルダーを印刷したい場合は、古き良き時代のようなことができます。例：

<div>
    <input type="text" placeholder="test">
    <span>test</span>
<div>

CSS

div{position:relative;}
span{position:absolute;top:0px;left:0px;display:none;}

CSS を印刷

span{display:block;}

もちろん、必要に応じて、これらのスパンを JavaScript で自動生成できます。プレースホルダーから値を取得し、spanin deを作成しますdiv

于 2013-05-30T03:26:14.737 に答える
0

かなり最近の記事 ( http://drublic.de/blog/printing-the-web/ ) でテストされ、サイトを印刷するときに各ブラウザーで多数の CSS ルールがどのように異なって実行されるかについて言及されました。テストから見えるように、同じことがいくつかの新しい html 属性にも当てはまります。

印刷に関してplaceholderは、CSS でスタイリングするのと似ていると思いますが、Chris Coyier が指摘しているように ( http://css-tricks.com/snippets/css/style-placeholder-text/ )、ベンダー プレフィックスが必要です。 、各ブラウザはそれを少し異なる方法で処理するためです。

ただし、ここや多くの記事で言及されているように、placeholderテキストは既存のラベルを補完する必要があり、テキスト自体に依存するべきではありません。したがって、表示されなくても (サポートされていないブラウザーであろうと、サイトの印刷物であろうと)、使いやすさや情報が失われることはありません。

于 2013-05-30T15:31:12.970 に答える