Html 在一个文本区域中是否可以有几种不同的文本颜色?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3435167/
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
Is it possible to have several different textcolors in one textarea?
提问by David
I'd like several words / phases in a textarea to appear in different colors... How would I go about doing this? Below is an example, I'd like the word green to appear green etc etc...
我希望 textarea 中的几个单词/阶段以不同的颜色显示......我该怎么做?下面是一个例子,我希望绿色这个词出现绿色等等......
<textarea style="width: 100%; height: 100%; resize: none;">
Is it possible to have multiple colors in a textarea?
How would i set certain phases or words to be different colors?
"Green"
"Red"
"Blue"
</textarea>
采纳答案by Nick Craver
You can't do this insidea <textarea>
, not one that's editable. It sounds like you're after a WYSIWYG editor, most of which use a <iframe>
to do this.
你不能在一个<textarea>
,而不是一个可编辑的里面做这件事。听起来您在使用WYSIWYG editor,其中大多数使用 a<iframe>
来执行此操作。
There are several JavaScript options for this, to name a few:
对此有几个 JavaScript 选项,仅举几例:
回答by Cannicide
You cannot do this with a textarea or input tag. However, as @naikus mentioned, you can use the contenteditable attribute. It is as follows:
你不能用 textarea 或 input 标签来做到这一点。但是,正如@naikus 提到的,您可以使用 contenteditable 属性。如下:
<div id="mytxt" contenteditable="true">
Hello, my name is <span style="color: blue;">Bob</span>
and I have a friend name <span style="color: green;">Joe</span>.
</div>
<div id="mytxt" contenteditable="true">
Hello, my name is <span style="color: blue;">Bob</span> and I have a friend name <span style="color: green;">Joe</span>.
</div>
回答by naikus
I don't think its possible to do that with a textarea and html alone. What you need is a Rich Text box You can either roll your ownby modifying an iframe, or use the popular ones available
我认为单独使用 textarea 和 html 不可能做到这一点。你需要的是一个富文本框你可以通过修改一个 iframe来滚动你自己的,或者使用可用的流行的
Other option you can have when you target html5 enabled browsers is the contentEditableattribute. You can use it to make a textbox-like control
当您定位支持 html5 的浏览器时,您可以拥有的其他选项是contentEditable属性。您可以使用它来制作类似文本框的控件
回答by Pekka
This is not possible in a normal textarea.
这在普通的 textarea 中是不可能的。
For syntax highlighting-like approaches, see the answers to this question.
For a more complicated, full-fledged WYSIWYG solution that can do colours as well as other formatting, images, etc., see a WYSIWYG editor like CKEditor.
回答by Pavel Morshenyuk
You can't do this with default html controls. You can use Rich Text Box editors to get what you want, for example check this question:
您不能使用默认的 html 控件执行此操作。您可以使用富文本框编辑器来获取您想要的内容,例如检查这个问题:
回答by Sinan
That's not possible with current w3c specs. If you're looking for a workaround, check codemirroror editAreafor their workarounds for syntax highlighting.
这在当前的 w3c 规范中是不可能的。如果您正在寻找解决方法,请检查codemirror或editArea以获取语法突出显示的解决方法。