Tôi muốn cung cấp một cuộn ngang cho một vùng văn bản trong trang HTML của tôi. Cuộn sẽ xuất hiện mà không cần gói, nếu tôi nhập một dòng dài mà không có ngắt dòng. Một vài người bạn đã đề xuất sử dụng thuộc tính CSS tràn, y không hoạt động cho tôi. Các trình duyệt mà tôi sử dụng là IE 6+ và Mozilla 3+.HTML Textarea scroll ngang
Trả lời
Để thiết lập không có bao bì, bạn sẽ sử dụng:
white-space: nowrap;
Đối với các giá trị khác: https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
Chú ý: Tuy nhiên, khấu hao wrap="off"
có vẻ là cách duy nhất để hỗ trợ trình duyệt di sản. Mặc dù nó không tuân thủ HTML 5, nó vẫn là sở thích của tôi nếu bạn đang nhắm mục tiêu tất cả các trình duyệt.
Hãy thử những:
overflow: scroll;
overflow-y: scroll;
overflow-x: scroll;
overflow:-moz-scrollbars-vertical;
cũng phải là một moz-scrollbars-ngang
tôi đã tìm ra để làm điều đó một cách phi W3C tuân thủ và nó đang làm việc trong cả hai trình duyệt IE và Firefox cũng như tình cờ trong Chrome.
Tôi đã thêm thuộc tính wrap
với giá trị off
, nghĩa là <textarea cols=80 rows=12 wrap='off'>
là những gì tôi đã làm.
Đây là cách làm việc duy nhất, phù hợp hoặc cách khác. –
Cách chính xác để thực hiện điều này là thông qua CSS như câu trả lời của [Aram Kocharyan] (http://stackoverflow.com/a/5104505/238722) chỉ ra. 'off' không phải là giá trị hợp lệ hoặc được công nhận của thuộc tính'
Nếu bạn có văn bản được định dạng trước bao gồm LF, bạn nên thêm white-space: pre;
vào css. Điều đó sẽ bảo tồn các dòng mới đã có trong văn bản và sẽ không bao bọc các dòng dài.
Tính năng này hoạt động trên tất cả các phiên bản của Firefox, tất cả các trình duyệt dựa trên Webkit và IE6 +.
Nguồn: https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
- 1. <textarea> với quy tắc ngang
- 2. Rendering HTML bên trong textarea
- 3. Đường ngang sử dụng HTML/CSS
- 4. Laravel và Infinite Scroll
- 5. Listview bên trong scrollviewer ngăn scroll scroller scroll
- 6. Infinite Auto Scroll ListView với Scroll Speed Controlled
- 7. Phiên bản Android của TextArea HTML là gì?
- 8. HTML TextArea tự động thay đổi kích thước
- 9. Độ dài tối đa cho HTML <textarea>
- 10. jQuery animate scroll
- 11. Vertical Scroll in stackpanel
- 12. UITableView Scroll kiện
- 13. Scroll div với các phím mũi tên
- 14. Cakephp textarea
- 15. Bật di chuyển dọc trên textarea
- 16. Nghe JS .scroll() hiệu quả
- 17. Kích hoạt $ (cửa sổ) .scroll();
- 18. Textarea Auto chiều cao
- 19. textarea bằng Javascript & PHP
- 20. Neo Html theo chiều ngang mà không có javascript
- 21. HTML - Hai bảng theo chiều ngang cạnh nhau
- 22. cách buộc cuộn ngang trong danh sách HTML bằng CSS?
- 23. jQuery - Scroll Chức năng Giữ Triggering: Chỉ khi hãy
- 24. Cuộn ngang?
- 25. Cuộn ngang Div
- 26. TextArea để Array với PHP
- 27. android listview scroll to number of listitems
- 28. ListBox Scroll Into View với MVVM
- 29. Hành vi UIPageViewController khác với Scroll & PageCurl
- 30. Bắn $ (cửa sổ) .scroll() khi tải trang
Điều này không hoạt động. Nó đặt tất cả văn bản, bao gồm nhiều dòng, trên cùng một dòng, không phải là hành vi mong muốn. –
Để xem các dòng mới đúng cách, bạn phải sử dụng 'khoảng trắng: trước;'. – Jesse