如何用html做文本框

html-css010

如何用html做文本框,第1张

border-radius属性可以实现元素的圆角。如下css可以实现文本框(单行、多行)的圆角:

input[type=text],textarea{border-radius:3pxborder:1px solid #000}

border-radius用法如下:

border-radius 属性是一个简写属性,用于设置四个 border-*-radius 属性。

该属性允许为元素添加圆角边框

语法:border-radius: 1-4 length|% / 1-4 length|%

按此顺序设置每个 radius 的四个值。

如果省略 bottom-left,则与 top-right 相同。

如果省略 bottom-right,则与 top-left 相同。

如果省略 top-right,则与 top-left 相同。

单位一般用px和百分比较多,其他单位也可以。

2、HTML中如何设置文本框的大小

边框的大小,可以使用CSS样式控制,如:

<textarea id="txtCon" >content</textarea><style type="text/css">#txtCon{width:100pxheight:20px}</style>

也可以使用文本框自己的属性,定义文本框的行和列控制大小,如:

<textarea id="txtCon" rows="100" cols="100" >content</textarea>

1.单行文本框:

<input type="text" style="height:20pxwidth:100px" />

2.多行文本框(文本域):

<textarea style="width:300pxheight:100px"></textarea>

文本框是单行的,而文本域可以输入多行,不过文本框也可以通过设置变成成多行。一般来说如果要填写的内容很多我们就用文本域<textarea>,反之用<text>。

可以使用html5的number类型实现限制文本框只能输入数字。

具体步骤如下:

需要准备的材料分别是:电脑、浏览器、ultraedit。

1、在ue编辑器中新建一个空白的html文件。

2、在ue编辑器中输入以下html代码。

3、编辑完成以后,在ue编辑器中点击保存,格式选择UTF8无BOM。

4、在浏览器中打开此html文件,可以看到最终想要实现的限制文本框只能输入数字效果。