Tiếp theo câu hỏi trước của tôi ( Thêm thanh cuộn vào <textareosystem ) về cách luôn nhìn thấy thanh cuộn ở dạng a <textarea>, tôi hiện đang tự hỏi bạn sẽ đặt nó như thế nào để không có thanh cuộn trong <textarea>, ngay cả khi văn bản bị tràn. Để cuộn xuống bằng cách này, bạn sẽ sử dụng các phím mũi tên hoặc chuột để điều hướng qua văn bản.
Tôi có thể làm cái này như thế nào?
Câu trả lời:
Hãy thử những cách sau, không chắc cái nào sẽ hoạt động với tất cả các trình duyệt hoặc trình duyệt bạn đang làm việc, nhưng tốt nhất là hãy thử tất cả:
<textarea style="overflow:auto"></textarea>
Hoặc là
<textarea style="overflow:hidden"></textarea>
... Như đã đề xuất ở trên
Bạn cũng có thể thử thêm cái này, tôi chưa bao giờ sử dụng nó trước đây, chỉ thấy nó được đăng trên một trang web hôm nay:
<textarea style="resize:none"></textarea>
Tùy chọn cuối cùng này sẽ loại bỏ khả năng thay đổi kích thước textarea. Bạn có thể tìm thêm thông tin về CSS resizebất động sản ở đây
style="overflow: hidden"và style="resize: none"là những người đã thực hiện thủ thuật.
Đối với MS IE 10, bạn có thể thấy mình cần thực hiện những việc sau:
-ms-overflow-style: none
Xem phần sau:
https://msdn.microsoft.com/en-us/library/hh771902(v=vs.85).aspx
Cho một lớp ví dụ: scrollcho thẻ textarea. Và trong css thêm thuộc tính này -
Nó hoạt động mà không bỏ lỡ phần cuộn
Ẩn thanh cuộn, nhưng vẫn có thể cuộn bằng CSS
Để ẩn thanh cuộn, hãy sử dụng -webkit- vì nó được hỗ trợ bởi các trình duyệt chính (Google Chrome, Safari hoặc các phiên bản Opera mới hơn). Có nhiều tùy chọn khác cho các trình duyệt khác được liệt kê bên dưới:
-webkit- (Chrome, Safari, newer versions of Opera):
.element::-webkit-scrollbar { width: 0 !important }
-moz- (Firefox):
.element { overflow: -moz-scrollbars-none; }
-ms- (Internet Explorer +10):
.element { -ms-overflow-style: none; }
ref: https://www.geeksforgeeks.org/hide-scroll-bar-but- Regi-still-being-able-to-scroll-using-css /
Tôi đã có thể loại bỏ thanh cuộn trên nội dung văn bản bằng cách loại bỏ thuộc tính max-height của lớp tôi.
<textarea style="overflow:hidden"></textarea>?