在html中，怎么使div中的內容超出后自動顯示滾動條的效果？最近在做項目中遇到這樣的一個問題，因為在彈框中的內容太多，彈框的大小固定，超出的內容我們用滾動條的效果來解決。
方法/步驟
-
問題一：怎么讓div內容超出后自動顯示滾動條
只需要用到css的一個overflow:auto的屬性就可以實現這效果了。下面我們看看代碼和實現的效果。
-
這次我做的是在一個div里面嵌套的div里實現的滾動條效果，如果你想讓外部的div顯示滾動條效果，只需在外部的div的class里面設置：overflow:auto即可。先要給定要設置出現滾動條div的寬高，內容超出給定的寬高之后，即可出現滾動條效果。
-
延伸：overflow:scroll.如果你想讓滾動條自始至終都存在，而不僅僅是內容超出后才出現，可以用overflow:scroll屬性。如下圖所示：（如果內容還未超過設置的寬高，那么不會顯示下拉的那個條）
-
問題二：怎么只顯示橫向的滾動條？
可以設置：overflow-x:scroll,或者：overflow-y:hidden即可實現這個效果。
同理如果overflow-y:scroll或者：overflow-x:hidden是只顯示豎的滾動條，不顯示橫向的滾動條。提示：如果設置橫向滾動條的時候，一直不顯示橫向拉的那個條是因為你的內容還不足以讓它顯示出來，如果是文字的話，它自動換行了，所以就不顯示，當設置white-space:nowrap；（不換行）的時候，內容超出就會出現。
-
關於overflow的其他屬性的介紹：
overflow 一共有5個屬性。
1、overflow:auto ；內容會被修剪，超出設置的寬高后會出現滾動條
2、overflow:scroll;內容會被修剪，不管內容是否超出，都會出現滾動條的位置
3、overflow:visible;這個是默認值，內容不會被修剪，會出現在元素框外面。
4、overflow:hidden;內容被修剪，多余的內容被隱藏
5、overflow:inherit;從父元素那里繼承overflow的值。