[英]Size div to browser's window height and width
我正在制作一個具有大背景設計的網站，但我聽不懂。
讓我解釋一下我想看的東西。 我的網站看起來幾乎就像這個網站http://www.deepend.com.au/-/website-development-fox8
1.用戶加載頁面
2.我頁面中每個div的高度都與瀏覽器窗口的高度相同，並且保持這種狀態，因此，滾動瀏覽我的頁面變得更加邏輯。
所以我的問題是：CSS中是否有可以獲取用戶瀏覽器窗口的屬性？ 還是應該使用JavaScript？ 如果使用JavaScript，是否有任何jQuery插件可以簡化我的工作？
感謝您的關注。
這只是一個巨大的圖像，它被設置為div的背景，並且在CSS中的大小為“ cover”，這意味着其寬度取決於其寬高比。
演示： http : //jsfiddle.net/f9yy8/4/embedded/result/
* { padding: 0; margin: 0; overflow:hidden;}
html, body { height: 100%;}
.txt {
background-image: url("http://elstika.com/images/2013/09/Pink-Tulips-Bouquet-Huge-Hd-Wallpaper.jpg");
background-repeat:no-repeat;
background-size: cover;
height: 100%;
color:white;
padding: 30px;
}
您可以嘗試使用div的position：absolute。
div{
position:absolute;
width:100%;
height:100%;
}
要覆蓋用戶瀏覽器窗口的100％寬度/高度，您可以執行以下操作：
的CSS
html, body {
width: 100%;
height: 100%;
overflow: hidden;
}
body {
background: url(images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
div.scroll {
overflow: auto;
}
的HTML
<html>
<body>
<div class="scroll">All your content inside here</div>
</body>
</html>
根據瀏覽器窗口的寬度和高度調整div樣式的大小-jQuery
[英]Re-size a div style respect to browser window width and height - Jquery
調整當前瀏覽器 window 最小化到特定的寬度和高度
[英]Re-size a current browser window on minimize to specific width and height
使用JavaScript根據瀏覽器窗口大小設置div的高度
[英]Using javascript to set the height of a div based on browser window size
使用JavaScript更改瀏覽器窗口大小時如何更改div寬度
[英]How to Change a div width when size of browser window change with javascript
Android瀏覽器的screen.width，screen.height＆window.innerWidth＆window.innerHeight不可靠
[英]Android browser's screen.width, screen.height & window.innerWidth & window.innerHeight are unreliable
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.