我实际上能看到的唯一解决方案是一个“金字塔”选择器，使用+直到你知道你将拥有的最大元素数。

* {
  float: left;
  user-select: none;
}

input {
  clear: left;
}

input:checked + a,
input:checked + a + a,
input:checked + a + a + a,
input:checked + a + a + a + a,
input:checked + a + a + a + a + a,
input:checked + a + a + a + a + a + a,
input:checked + a + a + a + a + a + a + a {
  background: gold;
}

<input type=checkbox checked>
<a>🍒</a>
<a>🍒</a>
<a>🍒</a>

<input type=checkbox>
<a>🍒</a>
<a>🍒</a>
<a>🍒</a>
<a>🍒</a>

<input type=checkbox checked>
<a>🍒</a>

<input type=checkbox>
<a>🍒</a>
<a>🍒</a>

复杂CSS解决方案

这个解决方案涉及position、伪元素和:has()。此解决方案将适用于未知数量的<a> s和预先存在或动态添加的行（参见示例A）。

示例A

示例中有详细注解

* {
  float: left;
  user-select: none;
}

body {
  overflow-x: hidden;
}

input {
  clear: left;
}

a {
  position: relative /* Allows ::after to reference <a> for
  positioning and stacking order */;
}

/*
- Targets the last <a> of each line.
- It's purpose is to mask any gold background that extends past 
  the last <a> of each line.
- Content is "🍒" which is transparent and is used to mirror
  the dimensions of a <a>.
- Pseudo-element is positioned to the outside right edge of the
  last <a> of each line.
*/
a:has(+input)::after, 
a:last-of-type::after {
  content: "🍒";
  position: absolute;
  z-index: -1;
  left: 100%;
  width: 96vw;
  color: transparent;
  background: white;
}

/*
- Targets the first <a> of each line.
- It's purpose is to add a gold background that extends close
  to the right edge of viewport for each line that's checked.
- Content is "🍒" which is transparent and is used to mirror
  the dimensions of a <a>.
- Pseudo-element is positioned to the inside left edge of the 
  first <a> of each line. 
*/
input:checked+a::after {
  content: "🍒";
  position: absolute;
  z-index: -2;
  left: 0;
  width: 96vw;
  color: transparent;
  background: gold;
}

/*
Same as previous but width is adjusted for lines with a single
<a>.
*/
input:checked+a:has(+input)::after {
  width: 100%;
}

<input type="checkbox" checked><a>🍒</a><a>🍒</a><a>🍒</a>
<input type="checkbox"><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a>
<input type="checkbox" checked><a>🍒</a>
<input type="checkbox"><a>🍒</a><a>🍒</a>
<input type="checkbox" checked><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a>
<input type="checkbox"><a>🍒</a><a>🍒</a><a>🍒</a><a>🍒</a>
<input type="checkbox" checked><a>🍒</a>
<input type="checkbox"><a>🍒</a><a>🍒</a>

简单HTML解决方案

如果您正在寻找最简单的选择器，则需要使用HTML隔离布局中的每个组。将每个组 Package 在<label>中，并将clear: left分配给每个label。不需要最后一个规则集（参见例B）。

示例B

* {
  float: left;
  user-select: none;
}

label {
  clear: left;
}

input:checked~a {
  background: gold;
}

<label>
  <input type="checkbox" checked>
  <a>🍒</a>
  <a>🍒</a>
  <a>🍒</a>
</label>

<label>
  <input type="checkbox">
  <a>🍒</a>
  <a>🍒</a>
  <a>🍒</a>
  <a>🍒</a>
</label>

<label>
  <input type="checkbox" checked>
  <a>🍒</a>
</label>

<label>
  <input type="checkbox">
  <a>🍒</a>
  <a>🍒</a>
</label>

您可以将背景金作为一个宽伪元素，在紧跟着选中的输入的第一个樱桃下。
然后，紧跟着输入的每个cherry都有一个宽白色的after伪元素。
有点黑客的感觉，但给视觉效果，是需要的，但有多少樱桃：

<style>
  * {
    float: left;
    user-select: none;
    overflow-x: hidden;
  }
  
  input {
    clear: left;
    position: relative;
  }
  
  a {
    position: relative;
  }
  
  input:checked+a::before {
    content: '';
    width: 100vw;
    height: 100%;
    position: absolute;
    background: gold;
    left: 0;
    top: 0;
    z-index: -2;
  }
  
  a:has(+ input)::after {
    background: white;
    content: '';
    width: 100vw;
    height: 100%;
    position: absolute;
    left: 100%;
    top: 0;
    z-index: -1;
  }
</style>
<input type=checkbox checked>
<a>🍒</a>
<a>🍒</a>
<a>🍒</a>

<input type=checkbox>
<a>🍒</a>
<a>🍒</a>
<a>🍒</a>
<a>🍒</a>

<input type=checkbox checked>
<a>🍒</a>

<input type=checkbox>
<a>🍒</a>
<a>🍒</a>