web-dev-qa-db-ja.com

cssを使用してズームレベルを設定する方法

私は最初に設定したFirefoxで特定のズームレベルを使用してWebアプリを開発しています（ctrl + Wheelを使用）。 Firefoxの別のPCでテストした場合、デフォルトの100％は大きすぎるようです。 cssを使用してデフォルトを設定できますか？

htmlcssfirefoxzoom
9
prat

DAによると、ズームはユーザーが制御する設定ですが、ズームに応じてサイズを変更できます。ユーザーがCtr +-を使用せずにサイズを変更し、デフォルトのフォントサイズを設定してサイズを変更すると、サイズを変更できます。フォントサイズをピクセル単位で設定して、このデフォルト設定に乗せます（ems、％などではありません）。ただし、これは、レタリング/サイズを判読できず、一部の人が変更できない可能性があるため、一般的に悪い習慣と見なされます。 、Ctr +-について知らず、デフォルトのフォントサイズに依存している人。

フォントサイズをemsまたは％で設定することにより、ユーザーのデフォルトとズーム設定を基準にしてサイズを調整できます。これにより、ユーザーセットのサイズに関連するもののサイズが変更されます。

これにより、各ページを他の人にどのように見せるかを確認できます。「小」、「中」、「大」の認識は人によって異なるためです。

7
Peter Ajtai
    <html>    
        <body>
            <div id="sampleDiv" style="width: 100px; background-color: Gray;">
                Zoom Me
            </div>
            <button onclick="sampleDiv.style.zoom='300%'">Zoom 300%</button>
            <button onclick="sampleDiv.style.zoom='200%'">Zoom 200%</button>
            <button onclick="sampleDiv.style.zoom='100%'">Zoom 100%</button>
        </body>
    </html>
11
zach

ページズームはブラウザの機能であり、CSS設定ではありません（ただし、IE独自のものであり、IEバグよりもバグを修正するのに非常に便利です）何でも）したがって、それはあなたが制御できるものではなく、ユーザーが制御する変数です。

5
DA.

CSSプロパティzoomを使用してズームを設定できます。これは古いIE ChromeやSafariでもサポートされているものです。

.zoom
{
    zoom: 120%;
}

ただし、これはおそらくライブサイトでは使用しないでください...

4
ᴍᴀᴛᴛ ʙᴀᴋᴇʀ