適用於iPad的簡單HTML佈局

Question

我正在嘗試編寫適用於所有設備的簡單佈局設計。我目前在iPad上遇到問題。整個網頁不應該滾動，但iPad試圖強制和滾動網站的邊界外（我認爲它被稱爲覆蓋滾動，給你一個更流暢的感覺）。如果疊加滾動仍然存在，我真的沒有與該問題，但主要問題是：

• 當我打開網頁，並嘗試滾動垂直滾動的內容（白左內容或紅色正確的內容），整個網頁滾動而不是div本身。

• 如果我嘗試滑動滾動內容，有時會起作用，有時整個網頁會再次滾動。這完全不可預測。有人可以幫我做一個蹲下的例子嗎？

我想製作用於移動設備的獨立的css文件是必要的。當然，我們首先使用bootstrap。

Answer 1

你必須使用特定設備的媒體查詢，這是在橫向或縱向模式的iPad ..try一次..你可以試試這個在同一個css文件，以及在不同的文件

@media only screen 
 
and (min-device-width : 768px) 
 
and (max-device-width : 1024px) { /* STYLES GO HERE */}

景觀

@media only screen 
 
and (min-device-width : 768px) 
 
and (max-device-width : 1024px) 
 
and (orientation : landscape) { /* STYLES GO HERE */}

的iPad