HTML: Cách tạo DIV chỉ với các thanh cuộn dọc cho đoạn văn dài?

Question

Tôi muốn hiển thị các điều khoản và điều kiện lưu ý trên trang web của mình. Tôi không muốn sử dụng trường văn bản và cũng không muốn sử dụng toàn bộ trang của mình. Tôi chỉ muốn hiển thị văn bản của tôi trong khu vực được chọn và chỉ muốn sử dụng thanh cuộn dọc để đi xuống và đọc tất cả văn bản.

Hiện nay tôi đang sử dụng mã này:

<div style="width:10;height:10;overflow:scroll" > 
text text text text text text text text text 
text text text text text text text text text 
text text text text text text text text text 
text text text text text text text text text 
text text text text text text text text text 
text text text text text text text text text 
text text text text text text text text text 
text text text text text text text text text 
</div> 

Hai vấn đề:

1. Nó không phải là cố định chiều rộng và chiều cao và lây lan cho đến khi tất cả các văn bản xuất hiện.
2. Thứ hai nó hiển thị thanh cuộn ngang và tôi không muốn hiển thị nó.

Answer 1

Xem overflow-y. Đó là CSS 3.

Answer 2

Bạn cần phải xác định width và height trong px:

width: 10px; height: 10px; 

Bên cạnh đó, bạn có thể sử dụng overflow: auto; để ngăn chặn các thanh cuộn ngang hiển thị.

Vì vậy, bạn có thể muốn thử như sau:

<div style="width:100px; height:100px; overflow: auto;" > 
    text text text text text text text text text 
    text text text text text text text text text 
    text text text text text text text text text 
    text text text text text text text text text 
    text text text text text text text text text 
    text text text text text text text text text 
    text text text text text text text text text 
    text text text text text text text text text 
</div> 

Answer 3

Cảm ơn bạn trước tiên

Sử dụng overflow:auto nó hoạt động cho tôi.

thanh cuộn ngang biến mất.

Answer 4

để ẩn thanh cuộn ngang, bạn có thể thiết lập overflow-x để ẩn, như thế này:

overflow-x: hidden; 

Answer 5

Để hiển thị thanh cuộn dọc trong div của bạn, bạn cần phải thêm

height: 100px; 
overflow-y : scroll; 

hoặc

height: 100px; 
overflow-y : auto; 

Answer 6

Bạn có thể sử dụng thuộc tính tràn

style="overflow: scroll ;max-height: 250px; width: 50%;" 

Answer 7

overflow-y : scroll; 
overflow-x : hidden; 

height là không bắt buộc

Answer 8

Đối với trường hợp bất kỳ thiết overflow-x-hidden và tôi thích để thiết lập max-height để hạn chế việc mở rộng chiều cao của div. Mã của bạn sẽ trông giống như sau:

overflow-y: scroll; 
overflow-x: hidden; 
max-height: 450px;