小开

根据w3c, cols和rows都是textarea的必需属性。行和Cols是将适合文本区域的字符数，而不是像素或其他潜在的任意值。顺着row /cols走。

小开

最佳答案

我建议两者都用。如果客户端不支持CSS，行和cols是必需的，也是有用的。但作为一名设计师，我会重写它们以获得我想要的尺寸。

推荐的方法是通过外部样式表。

textarea {
width: 300px;
height: 150px;
}

<textarea> </textarea>

小开

答案是肯定的。也就是说，两者都应该使用。如果CSS被禁用或被用户样式表覆盖，如果没有行和cols(即使没有显式地使用它们，也有默认值)，文本区域就小得不可用。始终牢记可访问性问题。也就是说，如果你的样式表被允许控制文本区域的外观，你通常会得到一些看起来更好的东西，很好地适合整个页面设计，而且可以调整大小以跟上用户输入(当然，在良好品味的限制内)。

小开

 <textarea style="width:300px; height:150px;" ></textarea>

小开

文本区域的大小可以通过cols和rows属性指定，甚至更好;通过CSS的高度和宽度属性。所有主流浏览器都支持cols属性。一个主要的区别是<TEXTAREA ...>是一个容器标记:它有一个开始标记()。< / p >

小开

我通常不指定height，但指定width: ...和rows和cols。

通常，在我的情况下，只需要width和rows，以使文本区域相对于其他elems看起来更好。(如果有人不使用CSS， cols是一个备用方案，正如在其他答案中解释的那样。)

((同时指定rows和height感觉有点像复制数据吗?))

小开

textarea { height: auto; }

<textarea rows="10"></textarea>

这将触发浏览器将textarea的高度EXACTLY设置为行数加上它周围的填充。将CSS高度设置为精确的像素数量会留下任意的空白。

小开

< >强CSS < / >强

input
{
width: 300px;
height: 40px;
}

<强> HTML < / >强

<textarea rows="4" cols="50">HELLO</textarea>

小开

文本区域的一个主要特征是它们是可扩展的。在网页上，如果文本长度超过了你设置的空间(无论是使用行还是使用CSS)，就会导致文本区域出现滚动条。这可能是一个问题，当用户决定打印，特别是“打印”到PDF -所以设置一个舒适的大最小高度打印文本区域的CSS条件规则:

@media print {
textarea {
min-height: 900px;
}
}

小开

如果你不是每次都使用line-height:'..';属性控制textarea的高度，width属性控制textarea的宽度。

或者你可以通过下面的css来使用font-size:

#sbr {
font-size: 16px;
line-height:1.4;
width:100%;
}

小开

对于文本区域，我们可以使用下面的css来固定大小

    <textarea  class="form-control" style=" min-width:500px; max-width:100%;min-height:50px;height:100%;width:100%;" ></textarea>

在angularjs和angar7中测试

小开

HTML行和cols没有响应!

我用CSS定义了大小。作为一个提示:如果你为手机定义了一个小尺寸，考虑使用textarea:focus {};

在这里添加一些额外的空间，它只会在用户真正想要写一些东西的时候展开

小开

是的!…总是使用CSS样式文本区域，并避免使用属性，除非你需要支持一些不支持样式表的非常老的代理。否则，您完全可以使用CSS。下面是我默认的CSS文本区格式，在任何网站看起来都很漂亮。根据您的喜好定制它。下面包含了注释，所以你可以看到为什么我选择这些CSS属性和值:

textarea {
display: inline-block;
margin: 0;
padding: .2em;
width: auto;
min-width: 30em;
/* The max-width "100%" value fixes a weird issue where width is too wide by default and extends beyond 100% of the parent in some agents. */
max-width: 100%;
/* Height "auto" will allow the text area to expand vertically in size with a horizontal scrollbar if pre-existing content is added to the box before rendering. Remove this if you want a pre-set height. Use "em" to match the font size set in the website. */
height: auto;
/* Use "em" to define the height based on the text size set in your website and the text rows in the box, not a static pixel value. */
min-height: 10em;
/* Do not use "border" in textareas unless you want to remove the 3D box most browsers assign and flatten the box design. */
/*border: 1px solid black;*/
cursor: text;
/* Some textareas have a light gray background by default anyway. */
background-color: #eee;
/* Overflow "auto" allows the box to start with no scrollbars but add them as content fills the box. */
overflow: auto;
/* Resize creates a tab in the lower right corner of textarea for most modern browsers and allows users to resize the box manually. Note: Resize isn't supported by most older agents and IE. */
resize: both;
}

在我的“重置”中;我将这些值设置为“textarea"的默认值，默认情况下，它给所有的文本区域一个很好的外观和感觉，当检测到滚动时，一个调整大小的选项卡(非ie浏览器)，并修复了尺寸，包括一个高度，允许框根据你为用户放入其中的现有内容来调整自己的大小，以及一个宽度，不超出其父容器的限制。

我应该大小与CSS宽度/高度或HTML cols /行属性的文本区域?

< >强CSS < / >强

<强> HTML < / >强