Hướng dẫn Thêm chữ chéo avatar rất đẹp :D

[Bon]

Demo

Thêm code sau và EXTRA.css

.subvn {
height: 75px;
left: -5px;
overflow: hidden;
position: absolute;
text-align: right;
top: -5px;
width: 75px;
z-index: 1;
}
.subvn span {
background: rgba(0, 0, 0, 0) linear-gradient(rgb(36, 111, 175) 0%, rgb(36, 111, 175) 100%) repeat scroll 0 0;
box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
color: #fff;
display: block;
font-size: 10px;
font-weight: bold;
left: -21px;
line-height: 20px;
position: absolute;
text-align: center;
text-transform: uppercase;
top: 19px;
transform: rotate(-45deg);
width: 100px;
}
.subvn span::before {
border-color: rgb(36, 111, 175) transparent transparent rgb(36, 111, 175);
border-style: solid;
border-width: 3px;
content: "";
left: 0;
position: absolute;
top: 100%;
z-index: -1;
}
.subvn span::after {
border-color: rgb(36, 111, 175) rgb(36, 111, 175) transparent transparent;
border-style: solid;
border-width: 3px;
content: "";
position: absolute;
right: 0;
top: 100%;

Rồi vào message_user_info tìm <div class="extraUserInfo">
Chèn xuống dưới

<div class="subvn">
<span>SUBVN.NET</span>
</div>

Done ! nhớ like nhé @@ come back

 

[THB]

cái này có cần cái hình up lên host ko bạn nhỉ?
mình nhớ có 1 cái tương tự hình như là cần hình up lên host?
bác nào làm rồi cho ý kiến nhá.
thank @Bon

 

[Bon]

cái này có cần cái hình up lên host ko bạn nhỉ?
mình nhớ có 1 cái tương tự hình như là cần hình up lên host?
bác nào làm rồi cho ý kiến nhá.
thank @Bon

ko úp gì cả tất cả chỉ là css sửa chữ SUBVN.NET THÀNH CHỮ BẠN CẦN THAY
mình đang chạy site mình mà bác @@

 

[namhbnam]

Đẹp quá cám ơn bác nha.
Nó chèn vào 3 cái hình tròn như bên vnxf rồi @@

Tool Liên Minh Huyền Thoại
http://hnvautopro.com

 

[THB]

hiii.
bác chỉnh kích thước thử xem sao?

 

[namhbnam]

hiii.
bác chỉnh kích thước thử xem sao?

code nào cho font chạy dọc xuống ko nhỉ kiểu
H
N
V
ấy



Tool Liên Minh Huyền Thoại
http://hnvautopro.com

 

[namhbnam]

Thôi chịu bỏ, bác code lại nghiêng sang bên phải hộ em đc ko :v
Mà sao em mất 3 cái hình like tin nhắn vs huy hiệu trong khung tròn r nhỉ

Tool Liên Minh Huyền Thoại
http://hnvautopro.com

 

[Jindo_Katori]

Bác này code backgroud pro quá
Tks bác đã share
(Có điều không sài được bị che mất mặt giống thằng chột quá)

 

[HungTQ]

Đây là ribbon css cái này nếu user info để kiểu vnxf thì đúng là xấu không thể chê được . các bạn thử code mình share bên dưới đi có thể phù hợp với site bạn
http://tuyenquangit.com/tao-ribbon-dong-dau-tren-sidebar-xenforo.t68.html

 

[Bon]

Đây là ribbon css cái này nếu user info để kiểu vnxf thì đúng là xấu không thể chê được . các bạn thử code mình share bên dưới đi có thể phù hợp với site bạn
http://tuyenquangit.com/tao-ribbon-dong-dau-tren-sidebar-xenforo.t68.html

Của bác đẹp bác cứ share anh em nhận hết mà @@ giúp đỡ nhau phát triển là qá tốt

 

[Jindo_Katori]

Đây là ribbon css cái này nếu user info để kiểu vnxf thì đúng là xấu không thể chê được . các bạn thử code mình share bên dưới đi có thể phù hợp với site bạn
http://tuyenquangit.com/tao-ribbon-dong-dau-tren-sidebar-xenforo.t68.html

Công nhận cái của bác đẹp hơn

 

[KHUCTHUYDU]

cai nayf mới hay nè.... mới cần thiết hơn
https://xenforo.com/community/resources/avatar-maker-avatar-alive.4646/

 

[HungTQ]

Của bác đẹp bác cứ share anh em nhận hết mà @@ giúp đỡ nhau phát triển là qá tốt

Đi đâu cũng avatar nầy àh

 

[Bon]

View attachment 10786
Đi đâu cũng avatar nầy àh

Ukm hi avatar thật đây bác

 

[namhbnam]

Đây là ribbon css cái này nếu user info để kiểu vnxf thì đúng là xấu không thể chê được . các bạn thử code mình share bên dưới đi có thể phù hợp với site bạn
http://tuyenquangit.com/tao-ribbon-dong-dau-tren-sidebar-xenforo.t68.html

làm y như vậy không đc bác ak

 

[namhbnam]

Share code bên phải em ấy lại này cho hợp với bên vnxf

Extra.css

.ribbon {
  position: absolute;
  right: -5px; top: -5px;
  z-index: 1;
  overflow: hidden;
  width: 75px; height: 75px;
  text-align: right;
}
.ribbon span {
  font-size: 10px;
  font-weight: bold;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
  line-height: 20px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 100px;
  display: block;
  background: #79A70A;
  background: linear-gradient(#9BC90D 0%, #79A70A 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 19px; right: -21px;
}
.ribbon span::before {
  content: "";
  position: absolute; left: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid #79A70A;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #79A70A;
}
.ribbon span::after {
  content: "";
  position: absolute; right: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid transparent;
  border-right: 3px solid #79A70A;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #79A70A;
}

message_user_info

<div class="box">
   <div class="ribbon"><span>HNVAuto</span></div>
</div>

Tool liên minh huyền thoại
http://www.hnvautopro.com/

 

[eBin]

Có cách nào để khi rê chuột vào user_info thì nó mới hiện không?
Mình thấy style skinxf.net v3 có.

 

[Nausixkiz]

Cái này làm lệch chấm online r

 

[thodan36a]

thanks bạn, mình ko làm cái này mà nhờ cái này mình biết cách bỏ cái khung chữ chéo đó đi vì style nó có sẵn kaak

 

[thodan36a]

hix mình up avatar bị xoay ngang, khắc phục thế nào vậy các bạn?