css总结4:input 去掉外边框,placeholder的字体颜色、字号

时间:2021-11-23 02:20:45

1 input 标签去除外边框:

在进行webAPP开发时,input外边框非常影响美观,去除外边框方法如下:

<input style="border: 0px;outline:none;cursor: pointer;"  type="text" placeholder="请输入手机号">

解释:

border: 0px;

去除 placeholder 外的边框

outline:none;”

“去除点击input框时显示的边框

cursor: pointer;”

点击显示光标光标呈现为指示链接的指针(一只手)

2 placeholder的字体颜色:

  查阅不同资料后发现,因为各家浏览器对css支持各有不同,所以需要对齐区别设置:

  在样式表添加:

input::-webkit-input-placeholder {
/* WebKit browsers */
color: #999;
} input::-moz-placeholder {
/* Mozilla Firefox 4 to 18 */
color: #999;
} input::-moz-placeholder {
/* Mozilla Firefox 19+ */ color: #999;
} input::-ms-input-placeholder {
/* Internet Explorer 10+ */
color: #999;
}

效果:

css总结4:input 去掉外边框,placeholder的字体颜色、字号