- Tham gia
- 28/02/2015
- Bài viết
- 16,829
- Được Like
- 12,687
Thay đổi Avatar sang dạng tròn
Bài viết này sẽ hướng dẫn các bạn thay đổi avatar sang dạng tròn
Các bạn chỉ cần vào EXTRA.css và thêm đoạn code dưới đây:
Chúc các bạn thành công.
Bài viết này sẽ hướng dẫn các bạn thay đổi avatar sang dạng tròn
Các bạn chỉ cần vào EXTRA.css và thêm đoạn code dưới đây:
Mã:
.messageUserBlock div.avatarHolder .onlineMarker
{
display: inline-block;
width: 16px;
height: 16px;
/* margin: 9px 0 0 9px; <- if you'd like it on top left */
margin: 79px 0 0 79px;
background: #fff;
border: none!important;
border-radius: 50%!important
}
.messageUserBlock div.avatarHolder .onlineMarker:before
{
content: '';
position: absolute;
width: 10px;
height: 10px;
margin: 3px 0 0 -5px;
background: #7fb900;
border-color: #7fb900;
border-radius: 50%
}
.messageUserBlock div.avatarHolder .onlineMarker:after
{
content: '';
position: absolute;
width: 32px;
height: 32px;
margin: -9px 0 0 -17px;
border: 1px solid #7fb900;
border-radius: 50%;
box-shadow: 0 0 4px #7fb900, inset 0 0 4px #7fb900;
-webkit-transform: scale(0);
-webkit-animation: online 2.5s ease-in-out infinite;
animation: online 2.5s ease-in-out infinite
}
@-webkit-keyframes online
{
0% {opacity: 1;-webkit-transform: scale(0)}
50% {opacity: .7}
100% {opacity: 0;-webkit-transform: scale(1)}
}
@keyframes online
{
0% {opacity: 1;transform: scale(0)}
50% {opacity: .7}
100% {opacity: 0;transform: scale(1)}
}
.avatar img,
.avatar .img,
.avatarCropper {
border-radius: 50px !important;
}
Nguồn: skinxf.net
Bài viết liên quan
Được quan tâm
Bài viết mới