去除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内容的大小

去掉input默认的上下按钮：兼容性写法如下

获取input的焦点：

$(‘input[type="number"]’).focus();

最新文章

热门文章