如何删除存在于 textarea 右下角的点?HTML

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6340545/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 09:05:54  来源:igfitidea点击:

How to remove dots present at the right bottom-corner of the textarea ? HTML

htmlcsstextarea

提问by Jayaram

I'm trying to remove dots in a textareawhich are present at the bottom-right corner.

我正在尝试删除textarea出现在右下角的 a 中的点。

Here's an example of what I mean (from Chrome):
example

这是我的意思的一个例子(来自Chrome):
例子

How to remove those diagonal lines?

如何去除那些对角线?

回答by Red

Just add in your CSSfile

只需添加到您的CSS文件中

textarea { resize: none; }

Later (2019) edit: Related to this answer of mine and the rising number of GitHub code search results on resize: nonedeclarations applied to textareaelements, I wrote some lines on why I think CSS resize none on textareais bad for UX:

稍后(2019 年)编辑:与我的这个答案以及resize: none适用于textarea元素的声明的 GitHub 代码搜索结果数量不断增加有关,我写了一些关于为什么我认为 CSS resize none ontextarea对 UX 不利的行:

Very often, the textarea is limited to a number of rows and columns or it has fixed width and height defined via CSS. Based solely on my own experience, while answering to forums, writing contact forms on websites, filling live chat popups or even private messaging on Twitter this is very frustrating.

Sometimes you need to type a long reply that consists of many paragraphs and wrapping that text within a tiny textarea box makes it hard to understand and to follow as you type. There were many times when I had to write that text within Notepad++ for example and then just paste the whole reply in that small textarea. I admit I also opened the DevTools to override the resize: none declaration but that's not really a productive way to do things.

from https://catalin.red/css-resize-none-is-bad-for-ux/

很多时候,textarea 仅限于许多行和列,或者它具有通过 CSS 定义的固定宽度和高度。仅根据我自己的经验,在回答论坛、在网站上编写联系表格、填写实时聊天弹出窗口甚至在 Twitter 上发送私人消息时,这非常令人沮丧。

有时您需要输入一个由许多段落组成的长回复,并将该文本包装在一个很小的 ​​textarea 框中,这会使您在输入时难以理解和理解。例如,有很多次我不得不在 Notepad++ 中编写该文本,然后将整个回复粘贴到那个小文本区域中。我承认我也打开了 DevTools 来覆盖 resize: none 声明,但这并不是真正有效的做事方式。

来自https://catalin.red/css-resize-none-is-bad-for-ux/

So you might want to check this out before adding the above to your stylesheets.

因此,在将上述内容添加到样式表之前,您可能需要检查一下。

回答by thirteen

html

html

sass

蠢货

textarea {
  position: relative;
  z-index: 1;
  min-width: 1141px;
  min-height: 58px;
}

.resizer {
  position: relative;
  display: inline-block;
  &:after {
    content: "";
    border-top: 8px solid #1c87c7;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    -webkit-transform: rotate(-45deg);
    z-index: 1;
    opacity: 0.5;
    position: absolute;
    bottom: 1px;
    right: -3px;
    pointer-events: none;
  }
}
.arrow-resizer-textarea {
  height: 0;
  width: 0;
  border-top: 8px solid #1c87c7;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  -webkit-transform: rotate(-45deg);
  position: absolute;
  bottom: 1px;
  right: -3px;
  pointer-events: none;
  z-index: 2;
}

回答by Asma Alfauri

as simple as the following code in html just give the text area css style resize 

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