1. innerWidth 屬性和innerHeight 屬性

innerWidth獲取瀏覽器窗口寬度，注意不帶瀏覽器的邊框寬度，但是包括下拉按鈕的寬度

innerHeight獲取瀏覽器窗口高度，從瀏覽器底部到工具欄的距離，注意不包括工具欄的高度

innerWidth和innerHeight屬性只讀，沒有默認值

2. outerWidth屬性和outerHeight屬性

outerWidth是瀏覽器窗口包含瀏覽器邊框的寬度

outerHeight是瀏覽器窗口從瀏覽器上邊框到下邊框的高度

outerWidth和outerHeight屬性只讀，沒有默認值

3.pageXOffset和pageYOffset

pageXOffset和pageYOffset返回整個頁面水平和垂直方向的滾動距離

pageXOffset 設置或返回當前頁面相對于窗口顯示區左上角的 X 位置

pageYOffset 設置或返回當前頁面相對于窗口顯示區左上角的 Y 位置

初始頁面：

滑動后頁面：將上部分內容滑動消失

點擊按鈕查看pageYOffset:

4.screenX and screenY

瀏覽器窗口在顯示器中的位置，screenX表示水平位置，screenY表示垂直位置

screenY返回的是瀏覽器窗口頂部到顯示器頂部的距離

screenX返回的是瀏覽器窗口的左邊(從左邊框開始)到顯示器的右邊的距離

總結

以上是生活随笔為你收集整理的CSS之window的视图属性的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。