Html 使用 CSS 与列和行调整文本区域的大小
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16612950/
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
sizing a textarea with CSS vs with cols and rows
提问by frenchie
What's the difference between sizing a textarea with cols and rows and sizing a textarea with height and width?
使用 cols 和 rows 调整 textarea 大小与使用 height 和 width 调整 textarea 大小之间有什么区别?
<textarea id="TextArea1" cols="73" rows="12">with cols rows</textarea>
<textarea id="TextArea2" style="height:200px; width:600px";>with CSS</textarea>
采纳答案by James Montagne
cols
and rows
are relative to font size. height
and width
aren't.
cols
并且rows
是相对于字体大小的。 height
而width
不是。
EDIT:Saying they are relative to "font size" is a bit too simplistic. They take into account things such as line-height
and letter-spacing
if explicitly set as well.
编辑:说它们与“字体大小”有关有点过于简单化了。他们还考虑了诸如line-height
和letter-spacing
是否明确设置之类的事情。
回答by Jukka K. Korpela
- The
cols
androws
attributes were required by HTML specifications. W3C HTML5 (approved in 2014) made them optional, but with impractical default values (20 and 2). - The attributes take effect even when CSS is disabled.
- On the other hand, the attributes “lose” if dimensions are also specified in CSS.
- The
rows
attribute specifies the height in terms of lines (effectively, with the line height as implied unit), and thecols
attribute specifies the width in terms of “average” character width, a very vague concept, interpreted very differently by browsers. In CSS, any CSS units can be used and must be explicitly specified.
- 将
cols
和rows
属性是由HTML规范要求。W3C HTML5(2014 年批准)使它们成为可选的,但具有不切实际的默认值(20 和 2)。 - 即使禁用 CSS,这些属性也会生效。
- 另一方面,如果尺寸也在 CSS 中指定,则属性“丢失”。
- 该
rows
属性以行的形式指定高度(实际上,以行高为隐含单位),该cols
属性以“平均”字符宽度的形式指定宽度,这是一个非常模糊的概念,浏览器的解释非常不同。在 CSS 中,可以使用任何 CSS 单位,并且必须明确指定。
回答by Beko1997
CSS isn't that different. The result will be (almost) the same.
CSS 没有什么不同。结果将(几乎)相同。
I'm using most of the time max-width, min-width and the same for height. In new browsers like Chrome you can resize the textarea.
我大部分时间都在使用 max-width、min-width 和相同的高度。在像 Chrome 这样的新浏览器中,您可以调整文本区域的大小。