8,960
edits
No edit summary |
No edit summary |
||
| Line 10: | Line 10: | ||
#f44336 75% 100% | #f44336 75% 100% | ||
); | ); | ||
} | } | ||
| Line 47: | Line 42: | ||
font-size: 14px; | font-size: 14px; | ||
cursor: pointer; /* Указатель на элемент */ | cursor: pointer; /* Указатель на элемент */ | ||
transition: background 0.3s ease; /* Плавный переход для фона */ | |||
} | } | ||
.ring-chart27 ul li:nth-child(1) { | .ring-chart27 ul li:nth-child(1) { | ||
top: 5%; left: 50%; transform: translateX(-50%); | top: 5%; left: 50%; transform: translateX(-50%); | ||
background: | background: transparent; /* Прозрачный фон для первого сегмента */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(1):hover { | .ring-chart27 ul li:nth-child(1):hover { | ||
background: | background: rgba(76, 175, 80, 0.5); /* Подсветка при наведении */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(2) { | .ring-chart27 ul li:nth-child(2) { | ||
top: 50%; right: 5%; transform: translateY(-50%); | top: 50%; right: 5%; transform: translateY(-50%); | ||
background: | background: transparent; /* Прозрачный фон для второго сегмента */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(2):hover { | .ring-chart27 ul li:nth-child(2):hover { | ||
background: | background: rgba(255, 152, 0, 0.5); /* Подсветка при наведении */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(3) { | .ring-chart27 ul li:nth-child(3) { | ||
bottom: 5%; left: 50%; transform: translateX(-50%); | bottom: 5%; left: 50%; transform: translateX(-50%); | ||
background: | background: transparent; /* Прозрачный фон для третьего сегмента */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(3):hover { | .ring-chart27 ul li:nth-child(3):hover { | ||
background: | background: rgba(33, 150, 243, 0.5); /* Подсветка при наведении */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(4) { | .ring-chart27 ul li:nth-child(4) { | ||
top: 50%; left: 5%; transform: translateY(-50%); | top: 50%; left: 5%; transform: translateY(-50%); | ||
background: | background: transparent; /* Прозрачный фон для четвертого сегмента */ | ||
} | } | ||
.ring-chart27 ul li:nth-child(4):hover { | .ring-chart27 ul li:nth-child(4):hover { | ||
background: | background: rgba(244, 67, 54, 0.5); /* Подсветка при наведении */ | ||
} | } | ||