如何根據屏幕分辨率（高度）爲div高度編寫css？

我想根據屏幕高度爲div高度添加一些css，並且div高度必須是確切的屏幕高度。如何根據屏幕分辨率（高度）爲div高度編寫css？

任何人都可以幫忙嗎？

2016-03-04 subrahmanyam katakam

的可能的複製[製作瀏覽器窗口的分度100％的高度（http://stackoverflow.com/questions/1575141/make-div-100-height-瀏覽器窗口） –

閱讀有關@media screen

@media screen and (max-width: 1024px) { 
    div{width:1024px;} 
    } 


    @media screen and (min-device-width: 1600px) { 
    div {width: 1500px;} 
    } 


    @media screen and (max-device-width: 1600px) { 
    div {width: 1500px;} 
    }

另見

div(width:calc(100% - 20px);}

和Java Script

<div id="id" style="background-color:black;">text</div> 
<script> 
document.getElementById('id').style.width=screen.width; 
document.getElementById('id').style.height=screen.height; 

    /*or*/ 

document.getElementById('id').style.width=window.innerWidth; 
document.getElementById('id').style.height=window.innerHeight; 
</script>

來源

2016-03-04 12:02:51 Michael

我可以通過js來實現，但我想根據屏幕分辨率只用CSS來調整div高度。與@media查詢我們可以根據屏幕分辨率調整寬度，但對於高度，我怎麼能做到這一點？ –

我寫信給你，如果你不會只用css然後嘗試'@media screen'。閱讀它 – Michael

您可以使用JavaScript來獲得使用window.innerHeight窗口的高度（注意，這個值EXCLUDES滾動條/工具欄）。

完整的示例：

var windowHeight = window.innerHeight; 
var div = document.getElementById("div"); 
div.style.height = windowHeight

來源

2016-03-04 12:03:39

div { 
     background-color: red; 
     height: 100vh; 
    }

來源

2016-03-04 12:40:19 Rayudu

將此CSS添加到它可以工作的div – Rayudu

如何根據屏幕分辨率（高度）爲div高度編寫css？

回答

相關問題