当然有靠谱的解决办法！针对你遇到的「Cookie同意组件根元素下所有子元素字体偏小，且部分leaflet元素有内联字体样式」的问题，我给你整理了几个实用的CSS方案：

方案一：CSS变量+全局继承（最灵活推荐） #

这个方案用CSS变量统一控制缩放比例，同时强制所有子元素继承根元素的字体大小，轻松覆盖内联样式：

/* 给组件根元素定义缩放变量和基准字体 */
.cookie-consent-widget {
  --font-scale: 1.2; /* 调整这个值控制缩放比例，1.2=放大20%，1.5=放大50% */
  font-size: calc(1rem * var(--font-scale));
}

/* 强制所有子元素继承根元素字体大小，覆盖内联样式 */
.cookie-consent-widget * {
  font-size: inherit !important;
}

• 为什么用!important？因为内联CSS的优先级最高，必须用它才能强制覆盖leaflet元素的内联font-size；
• 好处是后续要调整缩放比例时，只需要修改--font-scale的值就行，不用改一堆代码。

方案二：直接设置根元素+强制继承（更简洁） #

如果不需要灵活调整比例，直接写死放大倍数也可以：

/* 根元素直接设置放大后的字体大小 */
.cookie-consent-widget {
  font-size: 1.2rem;
}

/* 所有子元素强制继承，覆盖内联样式 */
.cookie-consent-widget * {
  font-size: inherit !important;
}

这个写法更直接，适合确定好缩放比例后不需要频繁改动的场景。

方案三：精准针对内联样式元素（避免全局覆盖） #

如果你不想全局覆盖所有子元素，只想处理带内联字体的leaflet元素，可以用属性选择器精准定位：

.cookie-consent-widget {
  font-size: 1.2rem;
}

/* 只覆盖带内联font-size的子元素 */
.cookie-consent-widget [style*="font-size"] {
  font-size: inherit !important;
}

/* 其他子元素正常继承 */
.cookie-consent-widget *:not([style*="font-size"]) {
  font-size: inherit;
}

不过这个和前两个方案本质差不多，还是离不开!important，毕竟内联样式的优先级是最高的，除非你能修改组件源码（显然你做不到），所以这里用!important是合理的。

注意事项 #

• 尽量不要用transform: scale()来放大，它会把整个元素（包括宽高、边距）都缩放，很容易导致布局错位；
• 如果组件里有图标、按钮等特殊元素不需要放大，可以单独给它们设置font-size: initial !important;来取消继承；
• 测试时可以逐步调整缩放比例，找到最适配你页面的字体大小。

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