多行文本框怎么设置宽度

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

操作方法

  • 01

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

  • 02

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

  • 03

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

  • 04

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

  • 05

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

  • 06

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

  • 07

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

(0)

相关推荐

  • HTML多行文本框怎么设置宽度

    textarea是表单中的一个文本域,经常用来填写文字比较多时才用的文本域,文本域中也可以换行进行输入,在表单设计时,经常会在文本域的宽高,下面小编教教大家如何进行设置 操作方法 01 首先在html ...

  • WPS文字中添加文本框,对文本框进行设置的方法

    在文字编辑时,我们有时需要添加文本框,在文本框中输入文字后,就可以拖动文本框把文字随意挪到文档的任何位置,是非常方便的. 下面重点讲讲添加文本框的方法,以及对文本框进行设置的方法. 操作方法 01 打 ...

  • 如何在PowerPoint2013中添加文本框和设置文本

    在PowerPoint中输入文本也是我们常用的,那么,我们应该怎么输入和设置文本呢?下面,我们就一起来学习一下在PowerPoint2013中添加文本框和设置文本的方法。 操作步骤 1、用PowerP ...

  • Word中插入的文本框如何设置添加虚线边框

    今天给大家介绍一下Word中插入的文本框如何设置添加虚线边框的具体操作步骤.1. 打开Word文档,依次点击插入---文本框,然后输入文字.2. 将文本框选中后,上方就会显示出"绘图工具&q ...

  • WPS幻灯片中插入的文本框怎么设置添加发光效果

    今天给大家介绍一下WPS幻灯片中插入的文本框怎么设置添加发光效果的具体操作步骤.1. 首先打开电脑上的想要设置的WPS演示文稿,进入主页面后,选中幻灯片中的文本框,点击上方的[填充]选项2. 如图,在 ...

  • 高德地图中的搜索框怎么设置在页面底部

    今天给大家介绍一下高德地图中的搜索框怎么设置在页面底部的具体操作步骤.1. 进入高德地图后,点击页面右下角的我的选项,在打开的我的页面,点击右上角的齿轮图标,进入设置.2. 在打开的设置页面,找到首页 ...

  • word文档中的文本框如何设置添加虚线框

    今天跟大家介绍一下word文档中的文本框如何设置添加虚线框的具体操作步骤.1. 首先打开电脑,找到桌面上的word文档,双击打开2. 进入编辑页面后,依次点击上方菜单栏中的插入---文本框---横向选 ...

  • 如何在PPT文档中插入文本框并设置颜色

    PPT是现在十分常用的文件类型之一,有些新用户不知道如何在PPT文档中插入文本框并设置颜色,接下来小编就给大家介绍一下具体的操作步骤.方法一:1. 首先第一步根据下图所示,打开电脑中的PPT文档.2. ...

  • 设置QQ信息弹小框,怎么设置?

    一定要按照步骤设置啊,不然乱设置会弄跨Q.设置QQ信息弹小框,怎么设置?就是群或者好友信息来的时候他显示右下角显示这样 效果图: 操作方法 01 第一步 右击头像: 02 第二步 然后选择系统设置: ...