div大小，覆蓋80％的窗口顯示

如何設置我的第一個div到完整的窗口大小。通過暗示下面的代碼，它顯示了我從上到下覆蓋了40％，但我想設置它的div大小來覆蓋至少80％從上到下。我需要在Css中暗示哪些Css屬性。div大小，覆蓋80％的窗口顯示

HTML 我的頁面 HTML

<script type="text/javascript" src="scripts/jquery-2.1.4.js"></script> 
</head>  
<body> 


<div id="a"> 

    <div id="t" class="d"></div> 

    <div id="p" class="c"></div> 

    <div id="t" class="e"></div> 


</div> 
<div id="second"></div> 
<div id="third"></div> 


</body> 
</html>

CSS

@charset "utf-8"; 
#first, #second,#third{ 
    width: 100%; 
} 


#a{ 

    background:url('images/rc1.jpg') 50% 0 no-repeat fixed; 
    color: white; 
    position: relative; 
    height: 1300px; 
    margin: 0 auto; 
    padding: 160px 0 0 0; 
    padding: 0; 
    perspective: 1px; 

} 

#second{ 

    background:url('images/ra1.jpg') 50% 0 no-repeat fixed; 
    color: white; 
    height: 600px; 
    margin: 0 auto; 
    padding: 160px 0 0 0; 
    padding: 0; 
    perspective: 1px; 

} 
#third{ 

    background:url('images/rc11.jpg') 50% 0 no-repeat fixed; 
    color: white; 
    height: 600px; 
    margin: 0 auto; 
    padding: 160px 0 0 0; 
    padding: 0; 
    perspective: 1px; 

} 
.d{ 
    margin: auto; 
    position:relative; 
    width:=218px; 
    height: 73px; 
    left: auto; 
    top: 10%; 
    background: url('images/Logo.png') top left; 
    background-repeat: no-repeat; 
    background-position-x:50px; 

} 
.c{ 
    margin: auto; 
    position:relative; 
    width: =774px; 
    height: 209px; 
    left: auto; 
    top: 120%; 
    /*width:=137px; 
    height:88px;*/ 
    background: url('images/big_text.png'); 
    background-repeat: no-repeat; 
    background-position-x:339px; 
} 
.e{ 
    margin: auto; 
    position:relative; 
    width: =127px; 
    height: 37px; 
    left:auto; 
    top: 180%; 
    background: url('images/scroll_text.png'); 
    background-repeat: no-repeat; 
    background-position-x: 680px; 
}

來源

2015-11-04 dippune1

'最小高度：100vh;最小寬度：100％;' – Jay

我需要將這些屬性應用到#a中，而我的CSS中沒有任何更改。 – dippune1

是這個'background-position-x：680px;'工作？ –

使用的％和VH的混合：

HTML：

<div> 
</div>

而且不要忘記使用設置你的頁面*：

*{ 
    margin: 0; 
    padding: 0; 
} 
div{ 
background: red; 
width: 100%; 
height: 100vh; 
}

它將覆蓋整個窗口，非物質其尺寸

來源

2015-11-04 12:33:01

如何設置頁面我之前從未做過 – dippune1

@ dippune1 - 在CSS文件的頂部使用*並將填充和邊距設置爲0以避免頁面上出現空白 –

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
 

 
<script type="text/javascript"> 
 
$(document).ready(function(){ 
 

 
\t // for height 
 
\t $("#a").height($(window).height() - 100); // minus any value in pixel 
 

 
\t // for width 
 
\t $("#a").width($(window).width()); 
 

 
}); 
 

 

 
</script>

來源

2015-11-04 12:32:41

謝謝，但我不想使用jQuery它可以通過CSS來完成，這是我所尋找的。 – dippune1

div大小，覆蓋80％的窗口顯示

回答

相關問題