输入框景背景透明:
<input style="background:transparent;border:1px solid #ffffff">

鼠标划过输入框,输入框背景色变色:
<INPUT value="Type here" NAME="user_pass" TYPE="text" SIZE="29" οnmοuseοver="this.style.borderColor='black';this.style.backgroundColor='plum'" 
style="width: 106; height: 21" 
οnmοuseοut="this.style.borderColor='black';this.style.backgroundColor='#ffffff'" style="border-width:1px;border-color=black">

输入字时输入框边框闪烁(边框为小方型):
<Script Language="JavaScript">
function borderColor(){
if(self['oText'].style.borderColor=='red'){
self['oText'].style.borderColor = 'yellow';
}else{
self['oText'].style.borderColor = 'red';
}
oTime = setTimeout('borderColor()',400);
}
</Script>
<input type="text" id="oText" style="border:5px dotted red;color:red" οnfοcus="borderColor(this);" οnblur="clearTimeout(oTime);">

输入字时输入框边框闪烁(边框为虚线):
<style>
#oText{border:1px dotted #ff0000;ryo:expression(οnfοcus=function light (){with(document.all.oText){style.borderColor=(style.borderColor=="#ffee00"?"#ff0000":"#ffee00");timer=setTimeout(light,500);}},οnblur=function(){this.style.borderColor="#ff0000";clearTimeout(timer)})};
</style>
<input type="text" id="oText">

自动横向廷伸的输入框:
<input type="text" style="huerreson:expression(this.width=this.scrollWidth)" value="abcdefghijk">

自动向下廷伸的文本框:
<textarea name="content" rows="6" cols="80" onpropertychange="if(this.scrollHeight>80) this.style.posHeight=this.scrollHeight+5">输入几个回车试试</textarea>

只有下划线的文本框:
<input style="border:0;border-bottom:1 solid black;background:;">

软件序列号式的输入框:
<script for="T" event="onkeyup">
if(value.length==3)document.all[event.srcElement.sourceIndex+1].select();
</script>
<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T7" size="5" maxlength="3">

软件序列号式的输入框(完整版):
<script for="T" event="onkeyup">if(value.length==maxLength)document.all[event.srcElement.sourceIndex+1].focus();</script>
<script for="T" event="onfocus">select();</script>
<script for="Submit" event="onclick">
var sn=new Array();
for(i=0;i<T.length;i++)
sn=T.value;
alert(sn.join("—"));
</script>
<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">
<input type="submit" name="Submit">

转载于:https://www.cnblogs.com/zcl1224/p/4156380.html

JPG各种输入框样式相关推荐

  1. html input文本框样式,css 定义input文本输入框样式

    摘要 腾兴网为您分享:css 定义input文本输入框样式,找乐助手,长江e号,一点英语,天天爱等软件知识,以及多功能盒子,方寸天地,斗音,蚊声,奶牛牧场,聚好商城,滞纳金计算器,反p2p终结者,lo ...

  2. 谷歌浏览器使用记住密码功能 导致input 输入框样式改变的解决办法

    使用到谷歌浏览器的记忆功能时  选择的内容为浏览器保存的内容时  会导致样式改变! // 在使用浏览器保存的数据时 输入框的样式 input:-webkit-autofill , textarea:- ...

  3. easyui输入框样式_EasyUI动态改变输入框width

    easyui datagrid 动态改变大小 easyui datagrid 动态改变大小 EasyUi dialog 动态改变窗口大小 我只是需要改变高度,所以我的代码如下:$('#editUnit ...

  4. 修改input输入框样式

    首先要将input输入框的默认样式去掉 -web-kit-appearance:none;-moz-appearance: none; 然后将input输入框的轮廓去掉: outline:0; 完成样 ...

  5. 输入框向上移动HTML5,HTML输入框样式

    输入框景背景透明: 鼠标划过输入框,输入框背景色变色: style="width: 106; height: 21" οnmοuseοut="this.style.bor ...

  6. 简单验证码输入框样式

    项目页面需要输入验证码,可是百度了一下,没有找到简单的静态HTML样式.对于我一个初学者来说,没法直接拿过来就用.无奈之下,自己想了个办法,实现这个样式.因为现在上传资源最少要一分,所以现在拿出来在这 ...

  7. 喂~讲真~我很讨厌chrome谷歌浏览器的默认填充输入框input样式咧,敲击讨厌滴啦,怎么去掉介个样式尼

    //为什么不直接就用input,那是因为这样会覆盖checkbox和radio的样式,我们这里只需要清除输入框的谷歌样式 input[type="text"], input[typ ...

  8. php清除h5格式,移动端H5页面端怎样除去input输入框的默认样式

    这次给大家带来移动端H5页面端怎样除去input输入框的默认样式,移动端H5页面端除去input输入框的默认样式的注意事项有哪些,下面就是实战案例,一起来看一下. 前两天在开发在微信访问的HTML5页 ...

  9. html5首页图标怎么除掉,移动端H5页面端如何除去input输入框的默认样式

    移动端H5页面端如何除去input输入框的默认样式 发布时间:2020-09-29 16:41:58 来源:亿速云 阅读:124 作者:小新 这篇文章主要介绍了移动端H5页面端如何除去input输入框 ...

最新文章

  1. 【程序员趣味】用Python制作带字小人举牌
  2. 分析大咖说:做一个转化率提升 2% 的成功官网改版案例
  3. BZOJ.2707.[SDOI2012]走迷宫(期望 Tarjan 高斯消元)
  4. Protobuf序列化的原理-protobuf的基本应用
  5. oracle怎么获取行,在oracle中如何实现SELECT TOP N取得前几行记录
  6. json java 数据类型_程序员都应该了解的一种数据格式之 JSON
  7. Bokeh 添加注释
  8. Windows Server 2016 配置指南 之 安装 PHP redis 拓展
  9. 管道 通过匿名管道在进程间双向通信
  10. module.exports 与 exports区别
  11. 新手平面设计师如何在网上接单赚钱?
  12. 雪球网股票用户评论爬虫
  13. 人人网如何注册与设置密码
  14. Qt Creator 的下载与安装
  15. python图像_Python图像处理
  16. stackoverflow热门问题(二)- 如何确定C的数组的大小
  17. 交易订单处理失败,请稍后再试(ali64)
  18. FITC cy3/cy5荧光标记达卡巴嗪/托瑞米芬/盐酸阿霉素/替莫唑胺等药物 FITC-DTIC
  19. 技术从业者的未来(三)
  20. 【OpenGL】实现三维空间漫游和立方体、球体贴图

热门文章

  1. 深入理解C语言的函数调用过程
  2. DOS系统功能调用表(INT 21H)
  3. Linux信号量之内核信号量
  4. 类的公有类型(public)和私有类型(private)
  5. 截屏没有了_原来华为手机的截屏方法不止3种,用了这么久,现在才知道新玩法?...
  6. android-NDK-Opengl
  7. 关于LocalBroadcastManager的介绍和优势
  8. 在控制台显示sql语句,类似hibernate show_sql.
  9. Java Process.exitValue Process.waitFor()
  10. 美团笔试1--螺旋矩阵