Maqlao Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 Всех приветсвую. Подскажите пожалуйста, как реализовать стиль и обводку аватарки. (Показано на изображении) Спойлер Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
SlawkA Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 привет. вроде есть код сделать в полигоне. ну а об водку можно и самому добавить Спойлер Спойлер clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%); by_ix и Maqlao 2 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
aLEX49566 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 2 минуты назад, SlawkA сказал: об водку 😂 t_reks, cyr4x, by_ix и 1 другой 4 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 SlawkA С обводкой разобрался, а вот как сделать сам стиль фотографии ромбиком, пока не догнал. Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 SlawkA Почти близко) Поигрался с border-radius. Спойлер Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
AHristich Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 (изменено) 7 минут назад, Anche сказал: Почти близко) Поигрался с border-radius. Показать контент Чтобы не измываться над своим разумом посмотри html5book.ru/css-figury/?ysclid=l6kzettb5i693491497 И сделаешь на любой выбор Anche Не кривись. Там примеры какие захочешь и все с помощью css. Изменено 8 августа, 2022 пользователем AHristich Maqlao 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 AHristich Просто до этого ссылки не было, поэтому я и не понял к чему твоя отсылка.) Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 AHristich Странно, но с этим не получается, допустим ромбик я попытался сделать, вставляется просто фигура, самой авватарки нет. Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
AHristich Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 5 минут назад, Anche сказал: AHristich Странно, но с этим не получается, допустим ромбик я попытался сделать, вставляется просто фигура, самой авватарки нет. Ну мы же не знаем как вы делаете 🤷♂️ Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 AHristich Стандартный код. } .ipsUserPhoto img { border-radius: inherit; width: 100%; height: 100%; vertical-align: top; object-fit: cover; } Как из этого сделать, чтобы аватар выглядил ромбиком?) Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
aLEX49566 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 1 час назад, SlawkA сказал: clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%); Так не?) Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
AHristich Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 Anche .ipsUserPhoto { background:none; position: relative; z-index: 1800; overflow: hidden; border-radius:0; transform: rotate(45deg); } .ipsUserPhoto img { max-width: 100% ; transform: rotate(-45deg); } Не тестировано!!! Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 (изменено) AHristich Странно, но я у себя не могу найти .ipsUserPhoto. Шаблон default. Я тестил через код элемента. Изменено 8 августа, 2022 пользователем Anche Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
AHristich Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 6 минут назад, Anche сказал: AHristich Странно, но я у себя не могу найти .ipsUserPhoto. Шаблон default. Я тестил через код элемента. В custom.css добавь этот код. В Томске час ночи еслиф што Maqlao 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 Anche Протестил, аватар перекрывает звание и бэйдж. А в карточке пользователя, вообще бардак. Ахаха) AHristich Спойлер Спойлер ryancoolround 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
aLEX49566 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 сделал за минуту Спойлер Спойлер SlawkA 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 5 минут назад, aLEX49566 сказал: сделал за минуту Показать контент Показать контент Рад за тебя. aLEX49566 и SlawkA 1 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
aLEX49566 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 32 минуты назад, AHristich сказал: .ipsUserPhoto { Сюда надо вставить это: 49 минут назад, aLEX49566 сказал: Так не?) И потом уже радоваться )) Вернее сюда : .ipsUserPhoto { это: clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%); SlawkA 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 aLEX49566 В карточке профиля отображается как-то не корректно. А так да, то что нужно было мне.) Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
aLEX49566 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 Ну это уже править тебе под свой форум Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 (изменено) 4 минуты назад, aLEX49566 сказал: Ну это уже править тебе под свой форум Как подогнать под контуры аватара?) Изменено 8 августа, 2022 пользователем Anche Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Dimarik111 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 2 часа назад, Anche сказал: Как подогнать под контуры аватара?) Anche Ставь код внизу ничего не удаляя Anche В общем должно выглядет так Anche Спойлер .ipsUserPhoto { background: transparent; clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%); Anche Anche SlawkA и aLEX49566 2 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
SlawkA Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 Dimarik111 у тебя в коде закрывающего нет } aLEX49566 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Dimarik111 Опубликовано 8 августа, 2022 Поделиться Опубликовано 8 августа, 2022 SlawkA .ipsUserPhoto { background: transparent; clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%); } aLEX49566 и SlawkA 2 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Maqlao Опубликовано 8 августа, 2022 Автор Поделиться Опубликовано 8 августа, 2022 Остановился все таки на своем.) Всем спасибо за помощь.🙂 SlawkA 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.