问：options.css 内容优化，将页面左边的功能列表背景设置成浅黑色 ，宽度设置成320；将页面右边的背景设置成浅灰色
gpt:
你可以通过在 `options.css` 文件中添加相应的样式规则来实现你的要求。以下是一个将左侧功能列表背景设置为浅黑色、宽度设置为 320px，右侧内容背景设置为浅灰色的样式示例：
```css
/* 设置整个选项页容器样式 */
.chat-container {
display: flex;
background-color: #f0f0f0; /* 设置整个容器背景色为浅灰色 */
}
/* 设置左侧功能列表样式 */
.function-list {
background-color: #222; /* 设置左侧功能列表背景色为浅黑色 */
width: 320px; /* 设置左侧功能列表宽度为320px */
color: #fff; /* 设置文字颜色为白色 */
padding: 20px; /* 添加一些内边距 */
}
/* 设置左侧功能列表项样式 */
.function-list ul {
list-style-type: none;
padding: 0;
}
.function-list li {
margin-bottom: 10px;
cursor: pointer;
}
/* 设置右侧内容容器样式 */
.content-container {
flex: 1; /* 右侧内容容器占据剩余的可用空间 */
background-color: #f0f0f0; /* 设置右侧内容背景色为浅灰色 */
padding: 20px; /* 添加一些内边距 */
overflow-y: auto; /* 添加垂直滚动条，以防内容溢出 */
}
/* 设置右侧内容的样式 */
.content-container p {
color: #333; /* 设置文字颜色为深灰色 */
font-size: 16px;
}
```
这些样式规则会将左侧功能列表的背景设置为浅黑色，宽度为320px，将右侧内容的背景设置为浅灰色。你可以根据需要进一步自定义样式以满足你的设计要求。确保将这些样式规则添加到你的 `options.css` 文件中，以实现所需的外观效果。