CSSスケールを使用した応答性のテクニック

CSSスケールプロパティを使用してウェブサイトをレスポンシブにする方法が不思議です。CSSスケールを使用した応答性のテクニック

基本的には、ウィンドウの幅を検出し、それに応じて要素をスケーリングが、問題は、あなたが使用している場合、そこにあるでしょうコード：exempleため

transform:scale(1.3);

、スケールがそのCSSのサイズをmantainsに適用される要素だから、javascriptで画面上の要素の実際の大きさを集めることは不可能だと思って、どれだけ拡大縮小すべきかを計算することは不可能です。

これに対処する方法についてのアイデアはありますか？ウィンドウの大きさに合わせてスケールすることも可能ですか？

2016-05-30 raphadko

をお勧めします。シンプルなメディアクエリははるかに優れたソリューションです。応答性のスケーリングは、私が時々キャンバスベースのブラウザゲームに使用しなければならなかったハックです。 –

CSSを使用してウィンドウのサイズに合わせてスケールすることができます。最大幅：50％;要素をブラウザの幅の50％に保ちます。

コードスニペットをフルページで実行し、ブラウザのサイズを変更します。

これは意味ですか？私が誤解した場合、私を許してください。 :)

.max-width { 
 
    height: 100px; 
 
    background-color: blue; 
 
    max-width: 50%; 
 
}

<div class="max-width"> 
 

 
</div>

2016-05-30 05:44:40 Hedge

adapar DIVの右ウェイ画面解像度に、パーセンテージまたは「最大幅」および「最小幅の特性を用いてさ "となります。よりcomodidaについては

はウィンドウや画面の幅に基づいて拡張することが可能であるbootstrap

2016-05-30 06:10:20

答えて