Как сделать, чтобы у людей были круглые аватарки?
- Предыдущая
- 1
- 2
- Показаны 16-29 из 29
если не ошибаюсь там не цсс нужно было править
howto rounded corners"скругление" и "круглое" это принципиально разное решение :)
пс: хотя там еще с тенью можно так же, и hover c задержкой чтоб голова закружилась — не пали)
пссс: кстати) а у меня аватарка круглая без css)))
тени исчезают в полденьхотя там еще с тенью можно
.avatar{ /* селектор для класса avatar */ float: left; /* прижимаемся к левому краю, обтекание справа */ background: #fff; /* фон */ width: 50px; /* ширина */ height: 50px; /* высота */ padding: 5px; /* внутренние отступы(верх, право, низ, лево) */ border: 1px solid #999; /* граница(ширина, тип, цвет) */ border-radius: 50%; /*скругление равно 50 процентам от общей ширины, фактически 25 пикселей, вот и круг получили(ещё есть с префиксом -moz и -o) */ box-shadow: 0px 1px 1px 1px #bbb /* смещение по горизонтали, смещение по вертикали, размытие, увеличение и цвет */ } .avatar img{ /* селектор для картинки, которая "внутри" класса avatar */ display: block; /* картинка выводится как блок, по ширине будет равен родителю(диву в котором находится) */ width: 100%; /* ширина 100% */ border: 0; /* граница нулевая */ margin: 0; /* внешний отступ отстутствует */ border-radius: 50%; /* читай выше */ }
.cmm_avatar { background: #DA251C; border: 1px solid #DA251C; border-radius: 45px; -moz-border-radius: 45px; -webkit-border-radius:45px; float: left; position: relative; overflow: hidden; padding: 2px; } .cmm_avatar img { border-radius:45px; box-shadow: 0 0 0 3px #DA251C, 0 0 10px #DA251C; -moz-box-shadow: 0 0 0 3px #DA251C, 0 0 10px #DA251C; -webkit-box-shadow: 0 0 0 3px #DA251C, 0 0 10px #DA251C; height: 70px; width: 70px; } {* ==== если нужен глянец =====*} .cmm_avatar:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, .15)), to(rgba(0, 0, 0, .25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, .1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0))); background: -moz-linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0)); background: linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0)); }
Кто-нибудь уже реализовал это для модуля «Последние регистрации»?
и что тут сложного? так сложно стили добавить к картинкам?Кто-нибудь уже реализовал это для модуля «Последние регистрации»?
Кто-нибудь уже реализовал это для модуля «Последние регистрации»?
Посмотрите файл модуля "последние регистрации" — по моему что-то вроде mod_lastreg.tpl узнайте какие там классы используются и потом в файле styles.css в содержимое этих файлов скопируйте css код свыше.
1) mod_new_user_avatar
2) usr_img_small
usr_img_small — используется почти везде, так что по осторожнее. Будет весь сайт круглым))
cmm_avatar — заменяете на .mod_new_user_avatar { код свыше }
далее писать не стала… думаю понятно.
А где это можно поменять? Я уже просмотрел все файлы css и у меня такого нет на версии 1.9.usr_img_small
- Предыдущая
- 1
- 2
- Показаны 16-29 из 29