html中加长输入框的边框,网页设计中文本输入框的一些参数说明

最新推荐文章于 2022-03-02 20:26:35 发布
最新推荐文章于 2022-03-02 20:26:35 发布
阅读量609 收藏 1
点赞数
文章标签： html中加长输入框的边框

网页设计中文本输入框的一些参数说明

互联网   发布时间：2009-04-02 20:54:39   作者：佚名   text-message.png 我要评论

在一般的留言本，论坛等地方都要用到文本输入框，也就是html语言中的textarea,textare包含有众多的参数，学会运用这些参数，就可以随意修改文本输入框的大小和外观，达到你想要的效果，下面就来介绍这些参数，以及如何使用这些参数。

在一般的留言本，论坛等地方都要用到文本输入框，也就是html语言中的textarea,textare包含有众多的参数，学会运用这些参数，就可以随意修改文本输入框的大小和外观，达到你想要的效果，下面就来介绍这些参数，以及如何使用这些参数。

在一般的留言本，论坛等地方都要用到文本输入框，也就是html语言中的textarea,textare包含有众多的参数，学会运用这些参数，就可以随意修改文本输入框的大小和外观，达到你想要的效果，下面就来介绍这些参数，以及如何使用这些参数。

1、cols，垂直列。在没有做样式表设置的情况下，它表示一行中可容纳下的字节数。例如cols=60，表示一行中最多可容纳60个字节，也就是30个汉字。另外要注意的是，文本框的宽度就是通过这个来调整，输入好cols的数值，然后再定义输入文字字体的大小(不定义的话，会采用默认值)，那么文本框的宽度就确定了。

2、rows，水平列。表示可显示的行数，例如rows=10，表示可显示10行。超过10行，则需要拖动滚动条来浏览了。(同上，文本框的高度就是通过这个来控制的。)

3、name，文本框的名称，这项必不可省，因为存储文本的时候必须用到。

4、warp，当warp="off"表示该文本区域中不自动换行，当然不写默认是自动换行的。这个参数一般用得比较少。

5、style，这是个非常实用的参数，可以用来设置文本框的背景色，滚动条颜色及形式，边框色，输入字体的大小颜色等等。

6、class,一般用来调用外部css里边的设置。

例1：设置文本框的行数为40，列数为10。名称为text。表达形式

例2：取消文本框右边的滚动条。表达形式。style="overflow:auto"的意思就是当输入的文本超出设置的行数时才自动显示滚动条。

例3：设置文本框的背景色。。

例4：另外设置文本框的滚动条颜色，边框色，以及字体大小，颜色，行距等，都可以直接在style里设置。不过这些一般都习惯在CSS里设置，直接调用就好了。下面是一段CSS设置代码：应该比较容易看懂，textbox里边依次设置的是文本框的背景色，上下左右边框色和厚度，以及输入字体的大小等。

.textbox { BACKGROUND: #BFCEDC; BORDER-TOP: #7F9DB9 1px solid; BORDER-LEFT: #7F9DB9 1px solid; BORDER-RIGHT: #7F9DB9 1px solid; BORDER-BOTTOM: #7F9DB9 1px solid; FONT-FAMILY: "宋体", "Verdana", "Arial", "Helvetica"; FONT-SIZE: 12px; TEXT-ALIGN: LIFT;}

把上面一段代码插到页面的

与之间。调用方式：。 class=""中的名字对应css里边要用到的设置的名字。熟悉了这些参数，修改和美化文本输入框就很方便了。

相关文章

e40efe845a0f664ad2a2f614e7bd4206.png

这篇文章主要介绍了html父子页面iframe双向发消息的实现示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来2020-10-12

02428f9a3a53c0dbc61aa524e045f3b8.png

这篇文章主要介绍了如何在HTML里加载摄像头，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-09-29

这篇文章主要介绍了html-webpack-plugin使用，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-09-15

fb53b03c06d6b99c2470ba5621627936.png

这篇文章主要介绍了html直接引用vue和element-ui的方法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-09-02

11c12187b7f88a98f8e187034751e1ae.png

这篇文章主要介绍了详解HTML中字体使用line-height依然不能垂直居中解决办法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友2020-08-20

7b55d6d8d4513e2aec57044733efc6d9.png

这篇文章主要介绍了前端html换肤功能的实现代码,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-08-20

fbf8fd9af4fb0a5f134d10cbbaabdac2.png

这篇文章主要介绍了多个HTML页面共同调用一段html代码的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来2020-08-17

这篇文章主要介绍了HTML中图片不存在显示默认图片的方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来2020-08-17

47e8b754abb2e662eb86e189d77d507f.png

这篇文章主要介绍了HTML table行距的改变方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学2020-07-31

这篇文章主要介绍了HTML Table 空白单元格补全的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一2020-07-31

最新评论

Gra Ccc
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML 文本域元素详解：如何使用属性创建多行输入框
a451319296的博客
12-16 6019
文本域介绍HTML 的文本域（Textarea）元素是一种创建多行文本输入框的简单方法。通过使用不同的属性，可以为文本域添加各种功能和行为，以提高用户的交互和表单填写体验。常用的属性包括 autofocus、disabled、form、maxlength、name、placeholder、readonly、required 和 wrap 等。除此之外，还有诸如 cols、rows、formaction、formenctype、formmethod 和 formtarget 等属性，可以进行更细致的控制。
input表单如何制作多行文本输入框？一篇文章教你学会使用input标签
lin123_00的博客
05-28 8105
本篇文章主要的为大家讲述了HTMLinput标签如何制作一个登陆界面的介绍，有文本框、密码框、单选框、多选框、提交和重置按钮的使用说明，完全的解释了HTML表单input标签的使用详情了。现在让我们来看看这篇文章吧 打造全网web前端全栈资料库（总目录）看完学的更快，掌握的更加牢固，你值得拥有（持续更新） 一、首先我们来看看如何制作文本框： <form action="url地址" method=“get/post” name="表单名称"> <p>这是文本框</p&g
CSS基础--颜色、字体、背景、边框等
qq_44489836的博客
03-02 6188
学习目标： 掌握 CSS 颜色，单位，注释等基本元素的使用方法 学习内容： CSS基础 1.颜色 指定颜色是通过使用预定义的颜色名称，或 RGB、HEX、HSL、RGBA、HSLA 值。 2.单位 CSS 有几种表示长度的不同单位。 许多 CSS 属性接受“长度”值，诸如 width、margin、padding、font-size 等。 长度是一个后面跟着长度单位的数字，诸如 10px、2em 等。 数字和单位之间不能出现空格。但是，如果值为 0，则可以省略单位。 对于某些 CSS 属性，允许使用负的长
html里设置边框的厚度,css – 如何设置边框的厚度百分比？
weixin_42510914的博客
06-16 600
边框不支持百分比…但它仍然可能…由于其他人已指向CSS specification，边界不支持百分比：'border-top-width','border-right-width','border-bottom-width','border-left-width'Value: | inheritInitial: mediumApplies to: all ...
html设置输入框长度_Html学习：key detection
weixin_39667452的博客
11-29 335
1 效果图：2 html骨架： detection ...... ...... 3 css部分： /*网页和body整体设置*/ html,body{ margin:0; padding:0; /*网...
HTML 文本框输入框 列表文本框和文本域 等等
m0_48219937的博客
08-06 1万+
初识表单和get提交 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录注册</title> </head> <body> <!--表单form action: 表单提交的位置，可以是网站，也可以是一个请求处理地址 method: post,get 提交方式 get方式:我们可以
html隐藏input边框线,html中去掉文本框(input type="text")的边框或只显示下边框
weixin_33473110的博客
06-03 3626
去掉：只留下边框：CSS - input 只显示下边框CSS 样式 : border:none; border-bottom: 1px solid #000文本框input&colon;text文本框 CreateTime--2017年4月24日10:40:40 Author:Marydon 一.文本框 (一)标签 ...input type &equals;text，按...
HTML文本框
weixin_44540251的博客
02-18 2万+
开发工具与关键技术：DW 作者：文泽钦 撰写时间：2019年2月18日 想写出一篇好文章，有感觉但没有情绪怎么办；一个抒情的网页，希望能给爱写做的朋友带来灵感，首先写一个div包裹整个页面： &lt;div class=”box”&gt; &lt;!—标题，text-align：center；文字居中--&gt; &lt;h2 style=”text-align:center;”&...
关于html表单实现md5加密，input框长度变化的问题。
Li_black的博客
07-12 1072
关于html表单实现md5加密，input框长度变化的问题。 问题描述： 今天在写html页面的时候，想实现一个登陆表单，考虑到表单提交数据的时候会以 name = value 的形式发送数据。 所以提交账号密码会存在一定的风险，所以想使用md5来进行密码加密，当然这不是传统的加密方式，在这里就简单一下。 在开发过程中我用jquery代码获得密码框内容，然后调用js的md5库加密，把密文写回到密码框，这是我们会发现密码框的长度会变长。 如下图： md5加密后： 这是因为以下代码： function lo
长文本输入
宇宙丶帅的博客
04-04 544
从屏幕输入长文本 *&---------------------------------------------------------------------* *&ReportYZS_LONGTEXT *&---------------------------------------------------------------------* *&amp...
html input文本输入框的一些总结
敲代码的Lee
03-12 1万+
1、选中去除文本框文字，离开后显示原有文字： &lt;input name="key" type="text" id="key" value="关键词" size="30" onmouseover=this.focus();this.select(); onclick="if(value==defaultValue){value='';this.st
HTML，多行文本输入框textarea
Dorothy_L的博客
09-16 1万+
HTML 标签 textarea 在大部分浏览器中只要指定行（rows）和列（cols）属性，就可以规定 textarea 的尺寸，但大小在浏览器中（firefox、chrome）还是可以调节的，在他的右下角会有一个拖动标志。 可以通过以下两种方式控制大小 textarea style=”height: 50px;width: 70px;resize: none;” textarea ro...
HTML中<input>参数，以及文本输入框，文本域的讲解
11-09 3万+
1、type：    当type="text"时，输入框为文本输入框;    当type="password"时, 输入框为密码输入框。 2、name：为文本框命名，以备后台程序ASP 、PHP使用。 3、value：为文本输入框设置默认值。(一般起到提示作用) 文本域，支持多行文本输入： 当用户需要在表单中输入大段文字时，需要用到文本输入域。 语法： rows="行数"
html文本输入框代码是什么？如何创建html文本输入框
lin123_00的博客
05-25 1万+
何创建html文本输入框？html文本输入框代码是什么？HTML表单是获取用户输入所需的内容。但是首先，你需要制作一个文本框，那么如何创建是一个问题，下面我们来讲一下Windows系统是如何创建html文本输入框。 打造全网web前端全栈资料库（总目录）看完学的更快，掌握的更加牢固，你值得拥有（持续更新） 一：首先创建一个HTML文件，打开记事本或任何其他纯文本编辑器，在Windows上，您可以通过“开始”菜单访问记事本，位于“附件”，然后是“记事本”。或者，使用Windows键+ R，然后键入记事本并
html input标签 单行文本框 多行文本框
热门推荐
qq_42265536的博客
12-22 11万+
input type属性 text 单行文本框 passworld 密码文本框 button 按钮 reset 重置按钮 image 图像形式的提交按钮 radio 单选按钮 checkbox 复选框 hidden 隐藏字段 file 文件上传 语法：    &lt;inp...
HTML中输入无限文字的文本框，可以随鼠标拖动大小
钱多多
07-30 8830
文本区中可容纳无限数量的文本，其中的文本的默认字体是等宽字体（通常是 Courier）。 可以通过 cols 和 rows 属性来规定 textarea 的尺寸，不过更好的办法是使用 CSS 的 height 和 width 属性。 注释：在文本输入区内的文本行间，用 "%OD%OA" （回车/换行）进行分隔。 最常用的属性是cols和rows，用来规定textarea的尺寸。另
html设置输入框长度_CSS美化的动态搜索输入框
weixin_39665762的博客
12-01 635
完成效果：CSS美化的动态搜索输入框HTML代码：CSS样式代码： /*去除默认样式 元素居中显示*/ body,html{ padding: 0; margin: 0; background-color: #34495e; height: 100vh; /*元素居中显示*/ display: flex; justify-content: center; align-items: center; ...
html中去掉文本框(input type="text")的边框或只显示下边框
apologize的学习之路
06-10 1万+
去掉： 只留下边框：
html实现字体加边框及填充
CDZAllier的博客
10-29 1万+
text-stroke字体描边 text-fill-color字体填充 <head> <meta charset="utf-8" /> <title>字体显示</title> <style type="text/css"> .fontShow{ font-size: 26px;text-stroke: 1px #2c9cf0; text-fill-color:#fff; font-weight: bold
el-cascader输入框加长
最新发布
09-28
在你提供的引用中，提到了一个关于el-cascader输入框的问题，即在详情查看时，回显的值没有显示在下拉框中。 这个问题的原因是，虽然在data里初始化声明了一个数组变量，但是在赋值时必须先再次声明为数组[]，然后...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值