相关疑难解决方法(0)

.animation-wrapper {
  width: 200px;
  height: 200px;
  border: 1px solid black;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  filter: brightness(0.8);
  -webkit-filter: brightness(0.8);
}
.pie-piece1 {
  position: absolute;
  width: 50%;
  height: 50%;
  bottom: 0;
  left: 0;
  background: linear-gradient(to right, rgba(255, 0, 0, 1) 0%, rgba(255, 255, 0, 1) 100%);
}
.pie-piece2 {
  position: absolute;
  width: 50%;
  height: 50%;
  bottom: 0;
  right: 0;
  background: linear-gradient(to right, rgba(255, 255, 0, 1) 0%, rgba(0, 255, 0, 1) 100%);
}
.pie-piece3 {
  position: absolute; …

<svg viewBox="0 0 400 400">
				<defs>  
	  <linearGradient id="GradientRepeat" x1="0" y1="1" x2="0" y2="0" spreadMethod="repeat">
      <stop offset="0.05" stop-color="#fff" stop-opacity="0"/>
      <stop offset="1" stop-color="#777" stop-opacity="1"/>
    </linearGradient>
	  </defs>
    <circle class="sub-menu-circle" cx="0" cy="200" r="160" fill="url(#GradientRepeat)" />
 </svg>

<svg viewBox="0 0 700 700" class="bubble-svg">
	<defs>

		<linearGradient id="GradientRepeat" x1="0" y1="1" x2="0" y2="0" spreadMethod="repeat" gradientTransform="rotate(170)">
			<stop offset="0%" stop-color="#fff" stop-opacity="0"/>
			<stop offset="10%" stop-color="#bdbdbd" stop-opacity="0.5"/>
			<stop offset="20%" stop-color="#fff" stop-opacity="0"/>
			<stop offset="30%" stop-color="#bdbdbd" stop-opacity="0.5"/>
			<stop offset="40%" stop-color="#fff" stop-opacity="0"/>
			<stop offset="50%" stop-color="#bdbdbd" stop-opacity="1"/>

			<stop offset="60%" stop-color="#fff" stop-opacity="0"/>
			<stop …