> ## 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 款式选择器颜色

> 自定义 upsell 部分中款式选择器的背景和文本颜色。

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

Upcart 允许你使用简单的自定义 CSS 更改 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-for-variant-selector-styling-in-v10">
  ## V1.0 款式选择器样式的示例 CSS
</div>

```
.upcart-upsell-item-variant-selector {     
  color: white !important;  
  background-color: #008060 !important;   
}
```

<div id="example-css-for-variant-selector-styling-in-v20">
  ## V2.0 款式选择器样式的示例 CSS
</div>

```
.upcart-public-component-upsell-tile__variant-row select {  
  color: white;     
  background-color: #008060;   
}
```

***

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

* **color**：设置文本颜色
* **background-color**：设置款式选择器框的背景

你可以使用不同类型的值，例如：

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

**示例：**

```
.upcart-public-component-upsell-tile__variant-row select {     
  color: #000000 !important;     
  background-color: #f3f4f6 !important;   
}
```

这让你可以打造一种款式选择器样式，既可以与商店设计融为一体，也可以突出显示以吸引注意力。

***

<div id="still-need-help">
  ## 仍需帮助？
</div>

如需更多自定义，我们建议与 **Shopify Expert** 合作。他们可以协助向你的 cart drawer 添加 HTML、CSS 或 JavaScript。

[查看 Shopify Experts](https://www.shopify.com/partners/directory)