更改信用卡占位符颜色 [英] Changing Credit Card Placeholder color

问题描述

我刚刚向这个网站添加了信用卡支付功能(您可能需要将商店中的商品放入您的购物篮中，然后转到结帐页面).

I have just added credit card payment features to this website (you may need to place an item in your basket from the shop in order to then go to the checkout page).

在底部，您可以看到信用卡详细信息的输入位置.

At the bottom you can see where credit card details are going to get entered.

我已经自定义了表单，最后一步是更改占位符文本的颜色.占位符图像这些在此图像中突出显示.

I have customized the form and one of my last steps is to change the colour of the placeholder text. Image of Placeholders These are highlighted in this image.

在检查此颜色的设置位置时，我找不到 CSS 代码.

I can't find the CSS code when inspecting as to where this color is set at all.

有没有其他方法可以找到颜色，或者任何人都可以指出正确的代码.

Is there another way I can find the colour or could anyone point me to the correct code.

推荐答案

输入您的 Wordpress 定制器并添加此自定义 CSS 代码并根据您的喜好进行

Enter your Wordpress Customizer and add this custom CSS code and edit it to your taste:

#stripe-card-element.StripeElement.empty {
background: #ffffff30 !important;
}
#stripe-exp-element.StripeElement.empty {
background: #ffffff30 !important;
}
#stripe-cvc-element.StripeElement.empty {
background: #ffffff30 !important;
}

这部分控制占位符的背景.这是什么意思?#stripe 是元素的一部分.如果你看到你有card-element"、exp-element"和cvc-element".每个编辑不同的部分.一个将编辑信用卡号元素的背景，到期日期元素之一和CVC元素的最后一个.

This part controls the background of the placeholder. What does it mean? The #stripe is part of an element. If you will see you have "card-element", "exp-element" and "cvc-element". Each edits a different part. One will edit the background of the credit card number element, one of the expiration date element and last of the CVC element.

#fffff 是十六进制颜色的代码(选择一个适合您的口味此处).HEX 颜色代码后面的 30 定义了不透明度(如果您希望颜色为纯色，您可以将其删除，或者只是在 01 到 99 之间使用) - 由您选择.

The #fffff is a code of a HEX color (choose one that fits your taste here). The 30 behind the HEX color code defines opacity (you can delete it if you want your color to be solid, or just play with it from 01 to 99) - the choice is yours.

玩你的代码，看看你能实现什么:)

Play with your code and see what you can achieve :)

这篇关于更改信用卡占位符颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！