子元素获取焦点，触发父元素的focus样式（纯css）

前言：

        这个解决方案存在多种，通过绑定焦点事件给指定的父dom添加类也是可以的,但我认为如果利用纯css来做效率会好很多。

我在项目中遇见的问题：

        我基于vuetify组件二次封装了一个颜色选择组件，在过程中因为同时存在hover样式与focus样式，内部结构划分为一个大盒子嵌套3个小盒子实现效果如下：

诉求：我内部任意一个input触发focus时，应该让外层的div也触发这个focus样式

解决方案：类名：focus-within

a:focus-within 是 CSS 伪类选择器，它用于匹配当元素内任何子元素（包括后代元素）获得焦点时的该元素。这意味着如果块元素内的任意子元素（如输入框、按钮等可以获取焦点的元素）获得了焦点，那么这个块元素将会触发 :focus-within 的样式