Комментарий #10819347

grin3671
Здравствуйте, а как изменить картинку в достижениях?
Вариант 1 (может не работать в некоторых браузерах):
/* Замена изображения Цундере 2-го уровня */
[src*="/assets/achievements/anime/tsundere_2.jpg"] {
  content: url("https://i.imgur.com/tPfPOud.gif");
  object-fit: cover;
}
В этом варианте /assets/achievements/anime/tsundere_2.jpg — это часть ссылки на заменяемое изображение, которую можно найти в адресной строке, если кликнуть правой кнопкой мыши по картинке достижения и нажать «Открыть картинку в новой вкладке» или просто «Копировать URL картинки».

Вариант 2:
/* Указывается один раз */
.b-achievement .c-image a::after,
.b-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--user-image, none);
  pointer-events: none;
}

/* Замена для всех уровней */
[href*="/achievements/common/tsundere"] {
  --user-image: url("https://i.imgur.com/tPfPOud.gif") center / cover;
}
/* Замена для определённых уровней */
.level-2 [href*="/achievements/common/tsundere"] {
  --user-image: url("https://i.imgur.com/tPfPOud.gif") center / cover;
}
/* Замена для франшиз */
[href*="/franchise/one_punch_man"] {
  --user-image: url("https://i.imgur.com/tPfPOud.gif") center / cover;
}
В этом варианте /achievements/common/tsundere или /franchise/one_punch_man — это часть ссылки на страницу достижения, которую можно найти в адресной строке, если кликнуть правой кнопкой мыши по достижению и нажать «Открыть ссылку в новой вкладке» или просто «Копировать адрес ссылки».
Ответы
Lien Kan
Lien Kan#
@grin3671, большое спасибо
Lien Kan
Lien Kan#
@grin3671, Border-color, а как это перекрасить? Скажите, пожалуйста.
назад
Твой комментарий
Вернуться к редактированию
Предпросмотр
Скрыть