Quên mật khẩu?

Ẩn quảng cáo - Esc
 » Thủ Thuật Tổng Hợp » Thủ Thuật Dành Cho Forum » Code [Code]Chatbox với style mới

Thích bài này? Bài trướcBài sau

Admin

on Sat Sep 21, 2013 10:13 am

#1
  • avatar

Admin



Administrator
Xem lý lịch thành viên http://vngame-vip.forumvi.com
Administrator
Gia nhập : 12/09/2013
Tổng số bài gửi : 999
Đồng vàng : 17421
Cảm ơn : 4056
default [Code]Chatbox với style mới

Demo :


Code:
chèn vào css nhé


Code:
#chatbox p {
float: left;
width: 98%;
line-height: 1.2em;
background: none;
position: relative;
padding-left: 10px;
}
.chatbox_row_1 .date-and-time {
right: 10px;
font-size: 10px;
font-family: Arial,Helvetica,sans-serif;
position: absolute;
top: 15px;
background: #ddd;
padding: 2px;
display: inline-block;
border: 1px solid #aaa;
border-radius: 2px;
visibility: hidden;
}
.chatbox_row_2 .date-and-time {
left: 20px;
font-size: 10px;
font-family: Arial,Helvetica,sans-serif;
position: absolute;
top: 15px;
background: #ddd;
padding: 2px;
display: inline-block;
border: 1px solid #aaa;
border-radius: 2px;
visibility: hidden;
}
p:hover .date-and-time {
visibility: visible;
}
#chatbox .user {
display: table-cell;
font-size: 0px !important;
}
.chatbox_row_1 .user {
margin-right: 20px;
float: left;
}
#chatbox .user a {
font-size: 12px;
text-decoration: none;
}
.msg {
padding: 5px;
border: 1px solid #D8DEC2;
display: table-cell;
border-radius: 3px;
max-width: 500px;
background: #F7FFD4;
font: 12px/1.5 Arial,Helvetica,sans-serif;
  position: relative;
}
.msg span {
color: #555 !important;
text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
}
.chatbox_row_1 .msg::before {
position: absolute;
content: '';
left: -12px;
width: 16px;
height: 16px;
background: transparent url("http://mail.yimg.com/ok/u/assets/sprite/default/16x16/opis-mode-ltr-26061.png") no-repeat 0 -326px;
top: 0;
}
.chatbox_row_2 .msg::after {
right: -11px;
position: absolute;
content: '';
width: 16px;
height: 16px;
background: transparent url("http://mail.yimg.com/ok/u/assets/sprite/default/16x16/opis-mode-ltr-26061.png") no-repeat 0 -295px;
top: 0;
}
.chatbox_row_1 .user-msg {
float: left;
}
.chatbox_row_2 .user-msg {
float: right;
}
.chatbox_row_2 .user, .chatbox_row_2 .msg {
float: right;
}
.chatbox_row_2 .msg {
background: #fff;
margin-right: 15px;
margin-left: 0;
}
.chatbox_row_1 > span.genmed > span:first-of-type, .chatbox_row_2 > span.genmed > span:first-of-type {
display: none;
}



.chatbox-title, .chatbox-title a.chat-title {
color: #454545;
text-decoration: none;
}

.chatbox-options li, .chatbox-options li a, .chatbox-options li label {
color: #454545;
}



input.button1, input.button2, button.button2, #main-content a.cgu-buttons {
border: 1px solid #afafaf;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
  -moz-box-shadow: 1px 3px 0px #afafaf;
  -webkit-box-shadow: 1px 3px 0px #afafaf;
}




.chatbox_row_2 .msg img{
max-width: 50px;
max-height: 50px;
}

.chatbox_row_1 .msg img{
max-width: 50px;
max-height: 50px;
}
.chatbox_row_2 .msg img{
max-width: 50px;
max-height: 50px;
}
.chatbox_row_2 .msg img{
max-width: 50px;
max-height: 50px;
}



.chatbox_row_1:hover,.chatbox_row_2:hover {
-webkit-box-shadow:#DCDCDC 0 0 4px;
border:1px solid #C9C9C9;
border-image:initial;
border-radius:5px;
box-shadow:#DCDCDC 0 0 3px;
background-color:#FFF;
margin:5px;
}

a:link,a:visited {
text-decoration:none;
}

#active_starters,#most_active,#pun-visit,#users_month,#users_week,#tooltip .header {
display:none;
}


#chatbox_messenger_form {
-webkit-box-shadow:#D4D4D4 0 0 4px;
background-color:#FFF;
border-bottom:0;
border-left:1px solid #C9C9C9;
border-radius:5px 5px 0 0;
border-right:1px solid #C9C9C9;
border-top:1px solid #C9C9C9;
bottom:0;
box-shadow:#C6C6C6 0 0 4px;
height:30px;
left:0;
margin-left:auto;
margin-right:auto;
position:fixed;
right:0;
width:100%;
z-index:999;
float:none;
background:rgba(250,250,250,0.79);
}

label input#message {
background-color:#FFF;
border:1px solid #C9C9C9;
border-image:initial;
border-radius:3px;
font-size:12px;
width: 625px;
padding: 6px;
}
#divbold,#divcolor,#divitalic,#divsmilies,#divstrike,#divunderline {
background:url(http://i25.servimg.com/u/f25/14/45/99/41/110.jpg) repeat-x #FFF;
border:1px solid #C9C9C9;
border-image:initial;
border-radius:3px;
}

.fontbutton {
border:0;
}

.fontbutton_normal {
background:#E1E1E2;
}

input#submit_button:hover {
background:url(http://i25.servimg.com/u/f25/14/45/99/41/hover10.jpg) repeat-x;
border:1px solid #A2A2A2;
border-image:initial;
color:#2C2C2C;
}

input#submit_button {
background:url(http://i25.servimg.com/u/f25/14/45/99/41/110.jpg) repeat-x #000000;
border:1px solid #C9C9C9;
border-image:initial;
border-radius:3px;
color:#929292;
cursor:pointer;
font-size:12px;
padding-left:2px;
padding-right:2px;
text-transform:uppercase;
}

#chatbox_header.main-head {
background-color: #FFFFFF;
color:#DEDFDF;
padding:0 1.3em;
}

#chatbox_members {
background-color: #615E5E;
color:#FFF;
font-family:Tahoma;
font-size:12px;
text-align:center;
background-color:#FFF;
padding:.5em .25em;

}
Trả lời chủ đề này
alomdan73

on Fri Jun 27, 2014 2:02 am

#2
  • avatar

alomdan73



Xem lý lịch thành viên
Gia nhập : 25/06/2014
Tổng số bài gửi : 63
Đồng vàng : 8021
Cảm ơn : 0
default Re: [Code]Chatbox với style mới

شكررررررررررررررررررررررررررا
Trả lời chủ đề này

Điện thoại: 050077777777777777 - Email: trihaivippro258@gmail.com - Yahoo: trihaivip_258@yahoo.com - Bảng báo giá