overflow: hidden; 和 overflow: auto; 是 CSS 中用於處理溢位內容的兩種常見方式，它們之間有一些區別：
-
overflow: hidden;：
- 當內容超出容器尺寸時，超出部分將被隱藏，不會顯示在容器之外。
- 不會顯示捲軸，使用者無法滾動檢視隱藏的內容。
- 超出的內容將被裁剪，即使使用者想要檢視也無法透過滾動來實現。
-
overflow: auto;：
- 當內容超出容器尺寸時，會根據需要自動顯示捲軸。
- 如果內容沒有超出容器尺寸，不會顯示捲軸。
- 允許使用者透過捲軸來檢視超出容器尺寸的內容，提供了更好的使用者體驗。
使用場景
- 使用
overflow: hidden;通常用於隱藏不需要顯示的溢位內容，或者用於建立視覺效果，比如裁剪圖片。 - 使用
overflow: auto;則通常用於容器中可能出現溢位內容的情況，以便使用者能夠滾動檢視全部內容。
區別總結
overflow: hidden;裁剪並隱藏溢位內容，不顯示捲軸。overflow: auto;自動顯示捲軸以允許使用者檢視溢位內容，但僅在需要時顯示。