EasyUI Div 區域添加滾動條：CSS overflow 屬性一行搞定

問題場景

固定高寬的 <div id="getpicture" style="height:900px; width:90%; border:1px solid #0000FF;"></div> 內容超出邊界時需顯示滾動條。

解決方案

<div id="getpicture" 
     style="margin-left:30px; margin-top:20px; height:900px; width:90%; border:1px solid #0000FF; 
            overflow:auto;"></div>

屬性值選擇指南

進階技巧

• 單向滾動：overflow-x:hidden; overflow-y:auto; 僅縱向。
• 自定義滾動條樣式（WebKit）：

  #getpicture::-webkit-scrollbar { width: 8px; }
  #getpicture::-webkit-scrollbar-thumb { background: #888; border-radius: 4px; }
  #getpicture::-webkit-scrollbar-track { background: #f1f1f1; }
  

• EasyUI Layout 組件：若在 layout 區域（region="center"），組件內部自動處理溢出，無需手動加 overflow。

常見坑點

1. 父容器未定高（height:auto 或無高度），子元素 overflow:auto 不生效。
2. position:absolute/fixed 子元素脫離文檔流，不觸發父容器滾動。
3. 浮動元素未清除（clearfix），導致父容器高度塌陷為 0。

總結：給固定高寬容器加 overflow:auto 即可，符合 CSS 盒模型規範，無需 EasyUI 專用 API。