从文本区删除滚动条

继我之前的问题(将滚动条添加到 < textarea > )关于如何总是在 <textarea>中看到滚动条，我现在想知道你将如何设置它，以便在 <textarea>中没有滚动条，即使当文本溢出。要用它向下滚动，可以使用箭头键或鼠标来浏览文本。

我怎么能这么做？

253104 次浏览
小开
最佳答案

Try the following, not sure which will work for all browsers or the browser you are working with, but it would be best to try all:

<textarea style="overflow:auto"></textarea>

Or

<textarea style="overflow:hidden"></textarea>

...As suggested above

You can also try adding this, I never used it before, just saw it posted on a site today: 

<textarea style="resize:none"></textarea>

This last option would remove the ability to resize the textarea. You can find more information on the CSS resize property here

小开

style="overflow: hidden" and style="resize: none" were the ones that did the trick.

小开

For MS IE 10 you'll probably find you need to do the following:

-ms-overflow-style: none

See the following:

https://msdn.microsoft.com/en-us/library/hh771902(v=vs.85).aspx

小开

Give a class for eg: scroll to the textarea tag. And in the css add this property -

.scroll::-webkit-scrollbar {
display: none;
}
<textarea class='scroll'></textarea>

It worked for without missing the scroll part

小开

I was able to get rid of my scroll bar on the body of text by removing my max-height attribute of my class.

小开

Hide scroll bar, but while still being able to scroll using CSS

To hide the scrollbar use -webkit- because it is supported by major browsers (Google Chrome, Safari or newer versions of Opera). There are many other options for the other browsers which are listed below:

    -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-while-still-being-able-to-scroll-using-css/

小开

Hide scroll bar for Mozilla.

  overflow: -moz-hidden-unscrollable;
小开

The solutions for just not displaying the scrollbar (instead of completely hiding overflow) mentioned in the other answers (see ::-webkit-scrollbar) work fine except for Firefox. Also the "-moz-" specific solutions mentioned are not working in Firefox for me.

Instead use:

scrollbar-width: none;

for Firefox!


提交答案