2017年5月10日のブックマーク (1件)

  • 知らないと損!CSSのvh/vwの使いこなしでレスポンシブなサイト制作が捗る

    CSSの値に指定できる単位といえば、pxや%などがおなじみ。でもレスポンシブなサイト制作では、vhやvwといったViewport単位がとても便利です。基と使いどころを解説します。 CSSにViewport単位(Viewport Uints)が導入されてから数年になります。ブラウザーのサイズが変更されるたびに値が変わるという意味で、真にレスポンシブな単位と言えます。Viewport単位について聞いたことはあるものの、詳しいことはまったく分からないという人は、この記事で理解を深めてください。 単位とその意味 CSSにはViewportを基準とした単位が4つあります。vh、vw、vmin、vmaxです。 Viewport Height(vh):viewportの高さに基づく。1vhはviewportの高さの1%に相当する Viewport Width(vw):viewportの幅に基づく。1v

    知らないと損!CSSのvh/vwの使いこなしでレスポンシブなサイト制作が捗る
    otoan52
    otoan52 2017/05/10
    ちゃんと理解していなかったので参考になった。あと...【翻訳ミス】“Chromeでは出力されません。” ではなく「印刷されません」っぽい