特定の幅の下でhtmlページ全体を縮尺する

これは私が思考過ぎるかもしれないという単純な問題のようです。特定の幅の下でhtmlページ全体を縮尺する

私は、CSSを使ってうまくスケールするページを持っていますが、360pxの幅でテキストを折り返さないようにする必要があります。これは360pxの幅で同じ割合のページを使用するだけで、ビューポートを使用してある意味では「ズームアウト」するというアイディアでした。これは320PX広い携帯電話（iPhone 5）の問題を引き起こして設定するためのビューポートのメタタグを使用する：

<meta name="viewport" content="width=device-width, min-width=360px, initial-scale=1.0"/>

私は、このページの実際のHTMLと身体に最小幅を設定すると一緒にこれをやっていました360pxの幅のコンテンツでは、横方向にスクロールしてページ全体を見たり、ピンチ/ズームアウトしたりする必要があります。

html, body { 
    width: 100%; 
    min-width: 360px; 
}

これには簡単な回答はありますか？

出典

2017-02-15 theleanmc

ボックスのfont-sizeをパーセント値に設定すると、要素が縮小しないようにする場合はページの残りの部分と縮尺することができます。

出典

2017-02-15 23:00:12 KevDev

テキストが折り返されるのを防ぐには、white-space: nowrap;を使用します。 <body>にwhite-spaceを使用すると、テキストのあまりを狂わせる

body { 
 
    white-space: nowrap; 
 
} 
 

 
p { 
 
    width: 200px; 
 
    border: 1px solid pink; 
 
}

<p> 
 
    Text text text text text text text text text text text text text text text text text text text text text. 
 
</p>

場合は、ユーティリティクラスを作成することができ、必要に応じて要素に適用されます。

.text-nowrap { 
    white-space: nowrap; 
}

出典

2017-02-15 23:10:48 hungerstar

特定の幅の下でhtmlページ全体を縮尺する

答えて

関連する問題