有时候需要用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内容的大小的更多相关文章

  1. 去除IE10自带的清除按钮

    最近在工作中碰到了一个问题,原本在IE8,IE9下正常的input表单,在IE10下会出现清除按钮,即表单右侧会出现一个可以清除该表单内容的小叉.由于之前一直没有兼容过IE10,所以我专门搜了下原因. ...

  2. 去除input 在 webkit内核浏览器 选择历史时,有一个黄色背景

    input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; } http://www.imooc.com/arti ...

  3. 去除input标签点击时的默认样式

    去除input标签点击时的默认样式的方法 outline:none; //去除点击时的边框 border : none; //去除input框的边框

  4. 用css去除chrome、safari等webikt内核浏览器对控件默认样式

    有这么一个webkit的私有属性: -webkit-appearance:none; /*去除input默认样式*/ 添加该样式,并且值为'none'时即可取消浏览器对于控件的默认样式. 另外这个属性 ...

  5. jquery ui 常用(一)(自动完成 | 标签页 | 折叠面板 | 带图标的按钮 | 日期选择器| )

    条件,引用3个文件 jquery-ui.min.css; jquery.min.js; jquery-ui.min.js. 一.自动完成 http://www.w3cschool.cc/jqueryu ...

  6. 改变按钮在iPhone下的默认风格

    -webkit-appearance: none; "来改变按钮在iPhone下的默认风格,其实我们可以反过来思路,使用"appearance"属性,来改变任何元素的浏览 ...

  7. WPF自定义控件之带倒计时的按钮--Button

    1.说明 之前做过一个小项目,点击按钮,按钮进入倒计时无效状态,计时完成后,恢复原样,现在就实现该效果---带倒计时的按钮 2.效果 1)正常状态               2)MouseOver( ...

  8. 【传】玩转Android---UI篇---ImageButton(带图标的按钮)

    原文网址:http://hualang.iteye.com/blog/964049 除了Android系统自带的Button按钮一万,还提供了带图标的按钮ImageButton 要制作带图标的按钮,首 ...

  9. 添加类似navigationController自带的返回按钮

    添加类似navigationController自带的返回按钮,效果如下: 一.UINavigationcontroller自带的navigationBar 是无法添加左箭头的返回按钮的 在网上搜索了 ...

随机推荐

  1. SHELL打印两个日期之间的日期

    SHELL打印两个日期之间的日期 [root@umout shell]# cat date_to_date.sh THIS_PATH=$(cd `dirname $0`;) cd $THIS_PATH ...

  2. python下载想听的有声书,让喜马拉雅收费,我是程序员!

    from urllib import parse,request import urllib header_dict = {'User-Agent': 'Mozilla/5.0 (Windows NT ...

  3. Sql语句拼接(EXEC和sp_executesql的区别)

    1.前言 MSSQL为我们提供了两种动态执行SQL语句的命令,分别是EXEC和sp_executesql;通常,sp_executesql则更具有优势,它提供了输入输出接口,而EXEC没有.还有一个最 ...

  4. uva 11367 (Dijkstra+DP)

    题意:一辆汽车在一张无向图中开告诉你每个城市加油的费用.每次给q个查询(起点,终点,油箱容量)问你最小花费是多少. 思路:一道Dijkstra状态的题目.在这种最短路问题中一维的dis数组记录的信息往 ...

  5. bzoj4520【CQOI2016】K远点对

    题解: kd-tree裸题 对每个点维护最近的k个开个堆维护一下

  6. C# 之 下载EXCEL文件,自动用迅雷下载aspx

    在浏览器中导出 Excel 得时候,如果浏览器绑定了迅雷,则会下载aspx文件. 解决:下载EXCEL文件,自动用迅雷下载aspx if (Request.QueryString["id&q ...

  7. Windows系统下MySQL添加到系统服务方法(mysql解压版)

    MySQL软件版本:64位 5.7.12 1.首先配置MySQL的环境变量,在系统环境变量Path的开头添加MySQL的bin目录的路径,以“;”结束,我的路径配置如下: 2.修改MySQL根目录下的 ...

  8. python的random()函数

    python 的random函数需要调用 #!/usr/bin/python # -*- coding: UTF-8 -*- import random print( random.randint(1 ...

  9. Java基础总结02:环境变量的配置

    (一)Windows系统下配置环境变量 ※在"系统变量"中设置3项属性JAVA_HOME.PATH.CLASSPATH(JDK1.5之后此项属性不必再配),若已存在则点击" ...

  10. springboot2 redis

    本项目使用jar包: <parent> <groupId>org.springframework.boot</groupId> <artifactId> ...