html5的placeholder属性

该文章由 leevare 发布于 ,归类于 HTML/CSS

placeholder的css兼容性写法

::-webkit-input-placeholder {
    color: #fff;
}
::-moz-placeholder {
    color: #fff;
}
:-ms-input-placeholder {
    color: #fff;
}
::placeholder {
    color: #fff;
}

尤其要注意不同前缀的写法也不同。

在指定的位置修改placeholder样式

#id::-webkit-input-placeholder {
    color: #fff;
}
#id::-moz-placeholder {
    color: #fff;
}
#id:-ms-input-placeholder {
    color: #fff;
}
#id::placeholder {
    color: #fff;
}

当然,如果你使用了autoprefix这一类的插件,这些写法就不用特别注意了,插件会自动完成css兼容。

使用js来检测浏览器是否支持placeholder属性

function isSupportPlaceholder() {
    var dom = document.createElement('input');
    return ('placeholder' in dom);
}

如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!

相关文章:

说点什么

avatar
300
  Subscribe  
提醒