[英]Justify Text in a HTML/XHTML TextArea
I am currently trying to justify text in a textarea, unfortunately the CSS: 我目前正在尝试在textarea中证明文本,不幸的是CSS:
text-align: justify;
Doesn't work on the text like center, left and right do. 对于像中心,左和右的文本不起作用。 I've tried this in both Firefox 3 and IE 7 with no luck. 我在Firefox 3和IE 7都尝试过这个,没有运气。
Is there any way around this? 有没有办法解决?
I dealt with same issue and found out very stupid solution. 我处理了同样的问题,发现了非常愚蠢的解决方案。 Make sure that the text to be displayed falls within the start and end tag elements in the same line and not in the next line 确保要显示的文本属于同一行中的开始和结束标记元素,而不是下一行
<textarea name="description" readonly="readonly" rows="4" cols="66">Text aligned toward left</textarea>
and not like 而不是喜欢
<textarea name="description" readonly="readonly" rows="4" cols="66">
Text aligned toward left
</textarea>
Depending on your target browser... this solution works in Chrome. 取决于您的目标浏览器...此解决方案适用于Chrome。 It does not work work in Firefox however... but I'll post it anyway. 但它在Firefox中无法正常工作......但无论如何我都会发布它。
In addition to setting text-align: justify, you must also set white-space: normal. 除了设置text-align:justify之外,还必须设置white-space:normal。
textarea {
text-align: justify;
white-space: normal;
}
JSFIDDLE: http://jsfiddle.net/cb5JN/ JSFIDDLE: http : //jsfiddle.net/cb5JN/
For me (in Firefox), this code works perfectly: 对我来说(在Firefox中),这段代码非常有效:
textarea{
resize: none;
text-align: justify;
white-space: pre-line;
-moz-text-align-last: left;
text-align-last: left;
}
I believe that common practice is to use the TEXTAREA
for input without worying about justification; 我认为,通常的做法是使用TEXTAREA
进行输入而不需要理由; and then, once the input is processed (ie the FORM
is submitted, or an event of the TEXTAREA
is captured), the contents are displayed in a non-editable text element (such as P
, SPAN
, TD
) where the text-align: justify;
然后,一旦处理了输入(即提交了FORM
,或者捕获了TEXTAREA
的事件),内容就会显示在text-align: justify;
的不可编辑的文本元素(如P
, SPAN
, TD
)中text-align: justify;
style attribute will be honored. style属性将被尊重。
Using a common div with contenteditable="true" worked in my case. 在我的案例中使用具有contenteditable =“true”的公共div 。 Doesn't work for most mobile browsers though. 但是对大多数移动浏览器不起作用。
<div contenteditable="true">Some content</div>
It works fine on Chrome, but not on IE. 它适用于Chrome,但不适用于IE。
text-align: justify; text-align:justify; white-space: normal; 白色空间:正常;
i dont think this is possible in the html textarea element. 我认为这不可能在html textarea元素中。 you might be able to use some sort of wysiwyg editor (editable div). 你也许可以使用某种所见即所得的编辑器(可编辑的div)。 ie. 即。 fckeditor FCKeditor的
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.