去除input默认带的上下按钮与修改placeholder的默认颜色、背景、placeholder内容的大小
有时候需要用input元素中type属性值为number时,会出现默认的上下按钮,
去掉input默认的上下按钮:兼容性写法如下
input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button{
-webkit-appearance:none !important;
}
//兼容火狐浏览器
input[type='number']{
-moz-appearance:textfield;
}
去掉前:

去掉后:

获取input的焦点:
获取input的焦点通过:
$(‘input[type="number"]’).focus();
进入页面光标闪动
修改placeholder内容的字体颜色、大小、背景:
input::-webkit-input-placeholder { /* WebKit browsers */
font-size: 20px;
color: red;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
font-size: 20px;
color: red;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
/* placeholder大小 */
font-size: 20px;
/* placeholder颜色 */
color: red; }
input:-ms-input-placeholder { /* Internet Explorer 10+ */ font-size: 20px; color: red; }
去除input默认带的上下按钮与修改placeholder的默认颜色、背景、placeholder内容的大小的更多相关文章
- 去除IE10自带的清除按钮
最近在工作中碰到了一个问题,原本在IE8,IE9下正常的input表单,在IE10下会出现清除按钮,即表单右侧会出现一个可以清除该表单内容的小叉.由于之前一直没有兼容过IE10,所以我专门搜了下原因. ...
- 去除input 在 webkit内核浏览器 选择历史时,有一个黄色背景
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; } http://www.imooc.com/arti ...
- 去除input标签点击时的默认样式
去除input标签点击时的默认样式的方法 outline:none; //去除点击时的边框 border : none; //去除input框的边框
- 用css去除chrome、safari等webikt内核浏览器对控件默认样式
有这么一个webkit的私有属性: -webkit-appearance:none; /*去除input默认样式*/ 添加该样式,并且值为'none'时即可取消浏览器对于控件的默认样式. 另外这个属性 ...
- jquery ui 常用(一)(自动完成 | 标签页 | 折叠面板 | 带图标的按钮 | 日期选择器| )
条件,引用3个文件 jquery-ui.min.css; jquery.min.js; jquery-ui.min.js. 一.自动完成 http://www.w3cschool.cc/jqueryu ...
- 改变按钮在iPhone下的默认风格
-webkit-appearance: none; "来改变按钮在iPhone下的默认风格,其实我们可以反过来思路,使用"appearance"属性,来改变任何元素的浏览 ...
- WPF自定义控件之带倒计时的按钮--Button
1.说明 之前做过一个小项目,点击按钮,按钮进入倒计时无效状态,计时完成后,恢复原样,现在就实现该效果---带倒计时的按钮 2.效果 1)正常状态 2)MouseOver( ...
- 【传】玩转Android---UI篇---ImageButton(带图标的按钮)
原文网址:http://hualang.iteye.com/blog/964049 除了Android系统自带的Button按钮一万,还提供了带图标的按钮ImageButton 要制作带图标的按钮,首 ...
- 添加类似navigationController自带的返回按钮
添加类似navigationController自带的返回按钮,效果如下: 一.UINavigationcontroller自带的navigationBar 是无法添加左箭头的返回按钮的 在网上搜索了 ...
随机推荐
- Hadoop ConnectTimeoutException
晚上继续学习tfidf示例.在跑TwoJob的时候报如下错误,开始以为是node02的防火墙没关好,但看了一下防火墙确实是关了的. 2019-03-30 23:48:19,705 INFO retry ...
- WARN conf.FlumeConfiguration: Could not configure sink sink1 due to: No channel configured for sink: sink1 org.apache.flume.conf.ConfigurationException: No channel configured for sink: sink1
1.错误如下所示,启动flume采集文件到hdfs案例的时候,出现如下所示的错误: 大概是说No channel configured for sink,所以应该是sink哪里配置出现了错误,百度了一 ...
- php函数xml转化数组
/** * xml转数组 * @param $xml * @return array */ function xml_to_array( $xml ) { $reg = "/<(\\w ...
- WebAPI——自动生成帮助文档
Web Api 自动生成帮助文档 新建Web Api项目之后,会在首页有API的导航菜单,点击即可看到API帮助文档,不过很遗憾,Description 是没有内容的. 怎么办呢? 第一步: 如果 ...
- 【Android】Android 代码判断是否获取ROOT权限(二)
[Android]Android 代码判断是否获取ROOT权限 方法比较简单,直接粘贴代码 /** * 判断当前手机是否有ROOT权限 * @return */ public boolean isRo ...
- 详细的ifcfg-eth0配置详解
通过查资料与工作中的进行一下总结: DEVICE="eth1" 网卡名称NM_CONTROLLED="yes" network mamager的参数 ,是否 ...
- 部署Tomcat及nginx负载均衡
Web应用服务器的选择 (1)IBM的WebSphere及Oracle的WebLogic 性能高,但价格也高 (2)Tomcat 性价比高 Tomcat服务器是一个免费的开放源代码的Web应用 ...
- Android ADB命令教程二——ADB命令详解
Android ADB命令教程二——ADB命令详解 转载▼ 原文链接:http://www.tbk.ren/article/249.html 我们使用 adb -h 来看看,adb命令里面 ...
- HDU 2586 How far away ?(经典)(RMQ + 在线ST+ Tarjan离线) 【LCA】
<题目链接> 题目大意:给你一棵带有边权的树,然后进行q次查询,每次查询输出指定两个节点之间的距离. 解题分析:本题有多重解决方法,首先,可用最短路轻易求解.若只用LCA解决本题,也有三种 ...
- poj 3067 Japan 【树状数组】
<题目链接> 题目大意: 有两个点集,这两个点集从上至下分别从1~n,1~m编号,现在给出n组数据,(x,y),表示左边点集编号为x的点与右边点集编号为y的点相连,现在要求计算这些线段的交 ...