A4サイズをpxで表すには？

Question

プリント作成サービスをつくろうと思っています。(wordのブラウザ版)
A4のサイズでプリントを作りたいとき実際のパソコンの画面でのサイズは何pxにすればよいのでしょうか。pcの解像度ごとに大きさが違うと知ってどうすればいいのかわからなくなってしまいました。

Answer 1

ご質問は、画面上にA4と同じサイズで表示したいという意味ではなくて、印刷した時にA4いっぱいになるpx数の話ですよね？
特に決まりはありません。
1x1のドット画像をA4いっぱいに引き延ばすこともできれば、高精細の1000万画素の写真をA4に収めることもできます。
ここで重要なのはDPI(dots per inch)で、1inchに何dot印刷するか、平たく言えば拡大率です。
それは印刷時の設定によるので、何とも言えません。

どういったシステムにしようとしているのかが分からないため、WEB上で作成した文書を印刷まで繋げる過程が想像できないのですが、プログラムでPDFを生成して印刷するのが確実かもしれません。
PDFには印刷設定をもろもろ含めることができるので、だいたいどんな環境でも印刷結果を共通化できると思われます。

それ以外だとCSSで整えたHTMLを直接印刷するための、印刷向けのCSS設定もあります。

CSSでの印刷時の設定は @page を使います。
また、その他の普通のCSSで、印刷時のみ有効化したい場合は @media print を使います。

この場合、サイズ指定は何ピクセルと考えるより、直接mmで指定するのが手っ取り早いと思います。

CSSで使用できる単位
https://w3g.jp/css/guide/units

ちなみにWordのブラウザ版、公式で出てますって言ったら出鼻くじかれちゃいます？
Microsoft Word Online

Answer 2

考慮すべき点については、SF6さんが書いていらっしゃますので、
その他として、
単純にA4と書いていらっしゃいますが、
１．用紙の縦横、両面、頁偶数、奇数、頁捲り、段組み、綴じ代：上、左、右
最近の複合機が持っている機能を調査した方が良いです。
⇒最大の障害は、メーカードライバ依存部分が公開される事が少ない。
解析を行っても、バージョン変更、機種変更で意味をなさなくなる。
２．機種毎の余白の扱いの違い。プリンタ側設定による違い。
簡単な例）フチなしプリントの有無やら
３．プリンタの基本解像度の違い、
プリンタの高解像度化に伴って、気にする事は少なくなりましたが
１２０、１４４、１６０、１８０などの違いによる、
小ドットでの罫線とフォントの扱い、余白の違い
（日本の様な書式、罫線、みてくれ命の帳票を作成する社会では、
WEB系印刷アプリはかなり、苦労するかも、妥協点を何処におくか。）
※単純に見える、Windowsのプリンタでのプロパティでさえ、
OS管理下の共通部分、メーカードライバ依存部分があり、
メーカードライバ依存部分に関しては、公開情報が無いか、少ないです。
’
DPI PPI違い
twip pixel dpi 違い
(twip はLinuxや、新規アプリでは死語でしょうが、Windowsの悪しき残滓が残っています。）

Answer 3

スクリーンの縦横のdpiを取得する必要があります。
dpiはdot per inchの略で、1インチが何pxかを示します。
A4用紙はおおよそ8.27×11.69インチだから、8.27=width/xdpi、11.69=height/ydpiとなるようにすればいいです。

dpiはscreen.deviceXDPI screen.deviceYDPIで取得できることもありますが、できない場合もあります。

そこで、1×1インチのdiv要素を作り、実際に何pxか取得することでdpiが分かります。

var etest = document.createElement("div"); //div要素を作る
etest.style.cssText = "width: 1in; height: 1in; position:absolute; left: -1in; right: -1in";
  //position以降は作ったdiv要素が画面に表示されないためのもの
document.documentElement.appendChild(etest); //bodyに追加 (実体を持たせる)
var xdpi = etest.offsetWidth, ydpi = etest.offsetHeight; //縦横のdpi

【追記】
どうもこの方法では本来のdpiでなく論理dpiが出てくるようです。