React中Google Maps InfoWindow样式修改：白色区域无法变红

你当前的CSS缺少对几个关键元素的样式定义，补充以下选择器即可覆盖剩余白色区域：

.gm-style .gm-style-iw-d::-webkit-scrollbar-track, 
.gm-style .gm-style-iw-d::-webkit-scrollbar-track-piece,
.gm-style .gm-style-iw-c,
.gm-style .gm-style-iw-t::after, 
.gm-style-iw-tc,
/* 覆盖顶部带关闭按钮的容器 */
.gm-style .gm-style-iw-t,
/* 覆盖内容区外层容器 */
.gm-style .gm-style-iw-d,
/* 覆盖关闭按钮的背景容器（可选） */
.gm-style .gm-ui-hover-effect { 
  background-color: red;      
} 

/* 可选：将关闭按钮改为白色，避免和红色背景混淆 */
.gm-style .gm-ui-hover-effect img {
  filter: brightness(0) invert(1);
}

如果使用React CSS模块化导致样式不生效，建议：

• 将这段样式放在全局CSS文件中（而非组件的模块化CSS）
• 或在必要时添加!important提升优先级（尽量少用，仅作为兜底方案）

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