Комментарий от Aizek Shturm

Комментарий #8941837
Aizek Shturm

в топике Обсуждение клуба CSS-club – настройка внешнего вида сайта16 ноября 2022

Хз кому это может быть нужно, но пусть будет.

Как поменять аватарку в списках аниме/манги

.p-user_rates-index .l-menu .avatar::before { 
content: ''; position: absolute; width: 99%; padding-bottom: 75%; background: url(ССЫЛКА НА ПИКЧУ/ГИФКУ) top center /  cover; border-radius: 0px; 
}

width: 99%; padding-bottom: 75%; - это изменение отображаемой области пикчи.

Если хотите с рамочкой, то добавляем это:

.p-user_rates-index .l-menu .avatar::before { border: 2px solid black; }

Где border: 2px solid black - настройка толщины и цвета рамки.

Выглядит это так

До

После

Конкретно у меня была вставлена гифка с Юки Нагато:

.p-user_rates-index .l-menu .avatar::before { 
content: ''; position: absolute; width: 99%; padding-bottom: 75%; background: url(https://i.imgur.com/lYcNRZe.gif) top center /  cover; border-radius: 0px; 
}
.p-user_rates-index .l-menu .avatar::before { border: 2px solid black; }

Селекторы искал через F12, если кто знает как оптимизировать, то просьба сообщить.

@test-acc

Ответы

test-acc16 ноября 2022#

@Aizek Shturm,

//code

.p-user_rates-index .avatar img {
    content: url(https://thumbs.gfycat.com/WealthyBelovedGreatdane-max-1mb.gif);
    border: 4px solid red; /* красные края */
}

@Aizek Shturm

Твой комментарий

Комментарий #8941837 Aizek Shturm

Комментарий #8941837
Aizek Shturm