移动端加入购物车按钮边框改为紫色的CSS实现请求

要给移动端加入购物车按钮设置紫色边框，你可以在现有CSS基础上添加边框相关属性，根据按钮的实际结构选择以下方案：

方案1：给伪元素添加紫色边框 #

如果按钮的视觉表现依赖::before伪元素，直接为该伪元素添加边框样式：

.add-to-cart-wrap .button::before {
  background: gold !important;
  /* 设置紫色边框，可调整厚度和样式 */
  border: 2px solid purple !important;
  /* 可选：添加圆角优化视觉效果 */
  border-radius: 4px;
}

方案2：直接给按钮本体添加紫色边框 #

若按钮自身有独立的边框层（伪元素仅作为背景），则直接修改.button的边框属性：

/* 设置按钮边框为紫色 */
.add-to-cart-wrap .button {
  border: 2px solid purple !important;
}
/* 保留已有的背景色修改 */
.add-to-cart-wrap .button::before {
  background: gold !important;
}

注意事项 #

• !important用于确保自定义样式优先级高于原有样式，若原有样式未强制优先级，可移除该声明
• 可将purple替换为具体色值（如十六进制#800080、RGBrgb(128,0,128)），2px可调整为所需的边框厚度

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