> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 更改 upsell 箭头颜色

> 使用自定义 CSS 调整 upsell 轮播中导航箭头的颜色。

<div id="overview">
  # 概述
</div>

默认情况下，Upcart upsell 部分的轮播箭头是黑色的。如果你的 upsell 背景较深，箭头可能难以看清。你可以通过简单的 CSS 更新来更改箭头颜色以解决此问题。

***

<div id="where-to-find-the-custom-css-editor">
  ## 在哪里找到自定义 CSS 编辑器
</div>

1. 前往 **Upcart > Cart Editor > Settings > Custom CSS**
2. 向下滚动到输入框并粘贴你的 CSS 代码
3. 点击 **Save**
4. 刷新你的店面预览更改

***

<div id="example-css-to-change-the-arrow-color-in-v10">
  ## V1.0 中更改箭头颜色的示例 CSS
</div>

```
.styles_PreviewCarousel__ [class~="control-next"]::before,  
.styles_PreviewCarousel__ [class~="control-prev"]::before {  
  border-color: white !important;  
}
```

<div id="example-css-to-change-the-arrow-color-in-v20">
  ## V2.0 中更改箭头颜色的示例 CSS
</div>

```
.upcart-public-component-carousel__button svg {  
  stroke: orange;  
}
```

上面的 V1 规则将箭头设置为白色；V2 规则将其设置为橙色。两者均适用于下一个和上一个箭头。

***

<div id="how-to-customize">
  ## 如何自定义
</div>

你可以更新 `border-color`、`stroke` 以匹配你品牌的配色。使用任何有效的颜色格式：

* 颜色名称（例如：`black`、`white`、`red`）
* 十六进制代码（例如：`#ffffff`）
* RGB 值（例如：`rgb(255, 255, 255)`）

**示例：**

```
border-color: #00bcd4 !important;
```

这可确保你的 upsell 导航箭头在任何背景颜色下都保持可见。