Javascript 使用css更改sweetalert占位符颜色
我的意见如下:Javascript 使用css更改sweetalert占位符颜色,javascript,css,sweetalert,Javascript,Css,Sweetalert,我的意见如下: swal({ title: "my title", text: "", type: "input", ima
swal({
title: "my title",
text: "",
type: "input",
imageUrl: "images/my_image.png",
showCancelButton: true,
closeOnConfirm: false,
animation: "slide-from-top",
inputPlaceholder: "username..."
},
function(inputValue){
if (inputValue === false) return false;
if (inputValue === "") {
swal.showInputError("you didn't type anything...");
return false
}
});
如何更改sweetalert中显示的输入占位符的颜色。我试过:
.sweet-alert input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: whitesmoke;
padding-left: 4px;
}
.sweet-alert input::-moz-placeholder { /* Firefox 19+ */
color: whitesmoke;
padding-left: 4px;
}
.sweet-alert input:-ms-input-placeholder { /* IE 10+ */
color: whitesmoke;
padding-left: 4px;
}
.sweet-alert input:-moz-placeholder { /* Firefox 18- */
color: whitesmoke;
padding-left: 4px;
}
.inputPlaceholder {
color: white !important;
}
找到了解决办法。在sweetalert.css文件中,有以下与placehodler相关的行:
.sweet-alert input:focus::-moz-placeholder {
transition: opacity 0.3s 0.03s ease;
opacity: 0.9; }
.sweet-alert input:focus:-ms-input-placeholder {
transition: opacity 0.3s 0.03s ease;
opacity: 0.9; }
.sweet-alert input:focus::-webkit-input-placeholder {
transition: opacity 0.3s 0.03s ease;
opacity: 0.9; }
.sweet-alert input::-moz-placeholder {
color: whitesmoke; }
.sweet-alert input:-ms-input-placeholder {
color: whitesmoke; }
.sweet-alert input::-webkit-input-placeholder {
color: whitesmoke; }
只需更改不透明度和颜色。我在网站的prompt demo上试用了你的css,效果很好。