如何在HTML/PHP中单独修改指定隐私政策复选框的背景色

你当前用的是Bootstrap 4的自定义复选框组件，这类组件的原生<input>复选框会被框架默认设置为完全透明，你肉眼看到的复选框方块、对勾，都是框架通过.custom-control-label的::before、::after伪元素渲染出来的。你之前直接给input加行内background-color属性不生效，本质是改到了被隐藏的原生元素上，根本碰不到实际显示的视觉层。
之前你把CSS写在文件里不生效，大概率是选择器优先级不够，被Bootstrap的默认样式覆盖了。

你不需要改动全局样式文件，直接在当前这段复选框代码前加一段带唯一id匹配的<style>标签即可——因为你已经给这个复选框设了全局唯一的idprivacypolicy，用id选择器写的样式只会作用在这一个元素上，完全不会影响页面其他复选框。
直接用下面的代码替换你原来的复选框代码即可，颜色值可以根据自己的需求改：

<!-- 以下样式仅对当前隐私政策复选框生效 -->
<style>
/* 未选中状态的复选框样式 */
#privacypolicy ~ .custom-control-label::before {
    background-color: #000000 !important; /* 未选中时的方块背景色，示例为黑色 */
    border-color: #000000 !important; /* 未选中时的方块边框色，和背景色保持一致即可 */
}
/* 选中状态的复选框样式 */
#privacypolicy:checked ~ .custom-control-label::before {
    background-color: #2563eb !important; /* 选中后的方块背景色，示例为蓝色 */
    border-color: #2563eb !important;
}
/* 选中状态的对勾样式 */
#privacypolicy:checked ~ .custom-control-label::after {
    color: #ffffff !important; /* 对勾颜色，默认白色即可 */
}
</style>

<label class="custom-control custom-checkbox mb-0">
      <input type="checkbox" class="custom-control-input" id="privacypolicy" value="1" tabindex="20"  onchange="jQuery('#privacypolicy').prop('disabled', false);" data-fieldblock="block<?php echo $i; ?>">
      <div class="custom-control-label mr-2"> <?php echo __("Accept","premiumpress") ?> <a href="www.site.com/privacypolicy" target="_blank"><?php echo __("<b>Privacy policy</b>","pp") ?></a> </div>
</label>

• 写十六进制颜色值必须带#前缀，你之前写的000000属于无效颜色值，就算写对位置也无法被浏览器识别
• 代码里的!important是为了强制覆盖Bootstrap的默认样式优先级，不要删掉，否则可能出现样式被覆盖不生效的问题
• 这段<style>标签直接放在当前PHP文件里就行，不需要额外引入文件，也不会影响其他页面的样式

内容的提问来源于stack exchange，提问作者eligolf