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);
}

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

如无特殊声明，文章均为原创，若有不正之处，万望告知。转载请附上原文地址，十分感谢！

本文地址：https://www.leevii.com/?p=396

相关文章: