网站首页 健康小知识 母婴教育 起名 运动知识 职场理财 情感生活 绿色生活 游戏数码 美容 特色美食 爱好

多行文本框怎么设置宽度

栏目: 互联网 / 发布于: / 人气:5.75K

多行文本框是HTML网页里的一个基本的控件,主要是用来给用户输入信息的,由于这个控件是多行的,因此可以输入较多的信息,且能够换行输入。下面我们就来看一下怎么设置这个控件的宽度。

操作方法

(01)首先我们在html代码里先输入一个textarea控件,也就是多行文本框。

多行文本框怎么设置宽度

(02)运行页面后,可以看到现在的多行文本框也就是按浏览器默认的宽度来显示的。

(03)要设置多行文本框的宽度,我们可以使用cols属性来设置。代码如图。

(04)这时我们再看下页面,可以发现现在多行文本框的宽度变宽了。

(05)但上面的方法,并不能准确的设置到多行文本框的宽度,并不能准确到像素级别的设置,所以我们最方便的方法还是使用样式来设置。我们先为这个控件添加一个样式名,如图

(06)然后再在代码里添加上对应的样式代码,在这里我们设置控件的高度和宽度,其中宽度设置为300像素。

多行文本框怎么设置宽度 第2张

(07)刷新页面,就可以目的地到效果了,可以看到现在的多行文本框的宽度变宽了,也完完整整是300像素的宽度。

多行文本框怎么设置宽度 第3张