我有一个Sweetalert如下:
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中的inputPlaceholder的颜色。我试过了:
.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文件中,以下几行与占位符有关:
.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; }
只需更改不透明度和颜色即可。
关于javascript - 使用CSS更改Sweetalert占位符颜色,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/41644424/