Webkitエンジンは新しい測定単位-vh、vw、vminをサポートします

これらの単位を使用すると、ブラウザウィンドウを基準にしてオブジェクトのサイズを設定できます。 サイズは、高さ(vh)、幅(vw)、または2つの値の最小値(vmin)の割合として計算されます。 パーセントサイズの指定とは異なり、vh、vw、およびvminは、現在のブロックのコンテナーではなく、常にウィンドウのサイズにバインドされます。 これまでのところ、Internet Explorer 9+のみがそれらをサポートしています(ただし、IEは標準で指定されているvminユニットの代わりに「vm」という表記を使用しています)。



したがって、この例:

<!doctype html> <head> <style> * { margin:0; padding:0; border:0; } #red { background:red; height:100vh; width:100vw; } </style> </head> <body> <div id="red"> </div> </body> </html>
      
      





IE9 +でのみ機能するようになりました。 Webkitにvhおよびvwユニットを含めることは、SafariおよびChromeですぐに利用できることを意味します。 そしてそこに、 MozillaとOperaが強化され、コーダーの生活が少し楽になります。



PS:vhとvwの詳細



All Articles