2017-01-22 5 views
1

クライアントのブラウザの高さを取得して、それをCSSに配置したいと考えています。ブラウザウィンドウの要素の高さを設定する

<div class="picture" id="picture1"> 
    <div class="parallax"><img src="assets/img/header-wrap-bg.jpg"></div> 
</div> 

画像クラス構造:

.picture { 
    height: /*(Here i wanna place browser height)*/; 
} 

と、これは私のイベントです:

<body onresize="HeaderResize()"> 

私はこれをどのように行うことができます。ここ

は私のメインのhtmlのですか?

+1

'高さ、CSSプロパティの下に使用し、あなたのフルスクリーンに合わせて要素を作成するには:100vh'? – haim770

+0

yeap :) thanx ... @ haim770 –

答えて

1

あなたはvh viewport-height unitsを使用することができます。ここでは

.picture { 
    height: 100vh; 
} 

それらはすべて、次のとおりです。

  • vw:1/100分のビューポートの幅
  • vh:1/100分のビューポートの高さ
  • vmin:最小の辺の1/100です
  • vmax:1、これはむしろそれがビューポートの高さ、技術的には、ブラウザの高さではないことを最大の側

注/第100回:

ビューポートがありますユーザーのWebページの可視領域。ビューポートはデバイスによって異なり、携帯電話ではコンピュータ画面よりも小さくなります。

enter image description here

関連する問題