一律調整

Question

私は同じ割合でズームインまたはズームアウトするときにどのように私のウェブページのサイズを変更することができるかを理解しようとしています。私はこれを行う方法を理解することはできませんが、ここで少しテストフィドルです私は数分で作成しました。ブラウザ/キャンバスの変更がすべてのテキストを大きさやものは割合を変更するたびに

https://jsfiddle.net/cejnkx4h/1/

ですから、この中で見ることができるように。私は、ユーザーが障害に対応するためにズームインできるようにしたいが、テキストのような一定の要素だけでなく、ウェブページ全体を同じ割合で拡大したい。 もし皆さんが私を助けることができれば、私はそれをたくさん感謝します。

body, 
 
html { 
 
    margin: 0; 
 
    background-image: url("https://www.hdwallpapers.in/walls/blur_colors-wide.jpg"); 
 
    background-position: cover; 
 
    background-size: 100%; 
 
    background-attachment: fixed; 
 
    min-width: 1000px; 
 
    background-repeat: no-repeat; 
 
} 
 

 
.bg { 
 
    width: 60%; 
 
    margin-left: 20%; 
 
    background-color: grey; 
 
    border: thick solid black; 
 
    height: 100%; 
 
} 
 

 
#right { 
 
    width: 45%; 
 
    vertical-align: baseline; 
 
    border: thick solid black; 
 
} 
 

 
#left { 
 
    width: 45%; 
 
    float: left; 
 
    font-size: 16pt; 
 
    color: black; 
 
    padding-top: 20px; 
 
} 
 

 
.format { 
 
    width: 85%; 
 
    margin-left: 10%; 
 
    overflow: hidden; 
 
    padding-top: 5%; 
 
    padding-bottom: 10%; 
 
    display: flex; 
 
    align-items: center; 
 
}

<div class="bg"> 
 
    <div class="format"> 
 
    <div id="left"> 
 
     <p> 
 
     Gaming Pc 
 
     <br/>$1500 
 
     </p> 
 
    </div> 
 
    <div id="right"> 
 
     <img src="https://www.cyberpowerpc.com/images/cs/smraidmax/blk_400.png" width="100%" </div> 
 
    </div> 
 
    </div>

Answer 1

あなたは比例ページを拡大縮小する変換CSSを使用することができます。

transform: scale(1); 

このようなものです。スケール1は100％を意味します。 50％で0.5、110％で1.1などに設定できます。

これが役に立ちます。