[Code] Làm đẹp chatbox mặc định cho Forumotion !

  • dksFeed
    1. [Code] Làm đẹp chatbox mặc định cho Forumotion !
    avatar MEM LV3
    DEMO:
     

    HƯỚNG DẪN: rất dễ làm (Copy code dưới sau bỏ nó vào hết CSS)
    Code:
    body.chatbox{background-color:#f3f3f3}#chatbox_members
     .online-users
    li{background-image:url(http://i.imgur.com/6A6tt.png);background-position:left;background-repeat:no-repeat;background-size:13%;padding-left:20px}#chatbox_header{background:url(http://i25.servimg.com/u/f25/14/45/99/41/untitl20.jpg)
     repeat-x!important;border-bottom:1px solid
    #c9c9c9;border-left:0;border-right:0;border-top:0;margin:0!important}h2.chatbox-title{margin-top:4px}#chatbox_header
     
    .chat-title{background:url(http://i25.servimg.com/u/f25/14/45/99/41/112_co11.png)
     
    no-repeat;color:transparent;cursor:default;font-size:14px;letter-spacing:-.4em;margin-bottom:-20px;margin-left:-20px}#chatbox_header
     
    .chat-title:hover{background:url(http://i25.servimg.com/u/f25/14/45/99/41/112.png)
     
    no-repeat;letter-spacing:2.1em}#chatbox_main_options,#chatbox_main_options
     a,#chatbox_main_options span{color:#9a9a9a !importat;font-family:Arial
    #000;text-decoration:none;text-shadow:1px 1px 1px
    #fff;text-transform:uppercase}#chatbox_main_options
    a:hover{color:grey;font-family:Arial
    #000;text-decoration:none!important;text-shadow:1px 1px 1px
    #b8b8b8;text-transform:uppercase}#chatbox_main_options{-moz-border-radius:0
     0 5px 5px;-moz-box-shadow:0 0 4px #c6c6c6;-webkit-box-shadow:0 0 4px
    #c6c6c6;background:url(http://i25.servimg.com/u/f25/14/45/99/41/untitl21.jpg)
     repeat-x;border:1px solid #c9c9c9;border-radius:0 0 5px
    5px;box-shadow:0 0 4px
    #c6c6c6;float:right;margin-right:50px;margin-top:-10px;padding:2px 3px
    1px
    5px}#chatbox_main_options:hover{margin-top:-1px}ul#chatbox_main_options
    li,ul#chatbox_main_options li,ul#chatbox_main_options li
    a,ul#chatbox_main_options li
    label{color:#9a9a9a!important;text-shadow:1px 1px 1px
    #fff}#chatbox_members{background:url(http://i25.servimg.com/u/f25/14/45/99/41/50347510.png);background-color:#fff;border-right:1px
     solid
    #c9c9c9;margin-bottom:-30px}#chatbox_members:hover{background-color:#fcfcfc;border-right:1px
     solid
    #b7b7b7}h4.member-title{background:url(http://i25.servimg.com/u/f25/14/45/99/41/untitl23.jpg)
     
    repeat-x!important;color:#fff!important;cursor:default;font-family:Arial
     #000;letter-spacing:.5em;margin-top:0;text-shadow:0 0 3px
    #000;text-transform:uppercase}#chatbox_members
    ul{list-style:none;margin:0}#chatbox_members ul
    li{background:url(http://i25.servimg.com/u/f25/14/45/99/41/115.png);border-bottom:1px
     solid #e2e2e2;color:#393939;font-family:Arial
    #000;font-size:14px;font-weight:700;margin:0;padding-left:10px}#chatbox_members
     ul
    li:hover{background-color:#f4f4f4;background-image:url(http://i25.servimg.com/u/f25/14/45/99/41/114.png);background-position:center
     left;background-repeat:no-repeat}#chatbox_members ul
    li:active{background-image:url(http://i25.servimg.com/u/f25/14/45/99/41/213.png)}#chatbox_members
     ul li
    a{color:#909090;font-size:12px;text-decoration:none;text-shadow:1px 1px
    1px #fff}#chatbox_members ul li
    a:hover{color:#393939;text-decoration:none!important}#chatbox{background-image:url(http://www.servimg.com/u/f34/12/24/45/65/map12810.jpg);background-position:center
     
    center;background-repeat:no-repeat}.chatbox_row_1,.chatbox_row_2{background-color:transparent!important}.chatbox_row_1:hover,.chatbox_row_2:hover{-moz-border-radius:5px;-moz-box-shadow:0
     0 3px #dcdcdc;-webkit-box-shadow:0 0 4px
    #dcdcdc;background:-moz-linear-gradient(top,#ffffff,#f9f9f9);background-color:#fff!important;border:1px
     solid #c9c9c9;border-radius:5px;box-shadow:0 0 3px
    #dcdcdc;margin:5px}.date-and-time{color:#c3c3c3!important;font-size:9px!important;font-style:italic!important;letter-spacing:-.1em!important}.user-msg{color:#8c8c8c!important;font-family:Georgia!important}.user-msg
     
    a:hover{color:#000!important;text-decoration:none!important}#chatbox_messenger_form{-moz-border-radius:5px
     5px 0 0;-moz-box-shadow:0 0 4px #c6c6c6;-webkit-box-shadow:0 0 4px
    #d4d4d4;background:-moz-linear-gradient(top,#ffffff,#e2e2e2)!important;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:0 0 4px
    #c6c6c6;float:none!important;height:30px;left:0;margin-left:auto;margin-right:auto;position:fixed;right:0;width:650px;z-index:999}#chatbox_messenger_form:hover{border-left:1px
     solid #a7a7a7;border-right:1px solid #a7a7a7;border-top:1px solid
    #a7a7a7}#divbold,#divcolor,#divitalic,#divsmilies,#divstrike,#divunderline{-moz-border-radius:3px;background:url(http://i25.servimg.com/u/f25/14/45/99/41/110.jpg)
     repeat-x;background-color:#fff;border:1px solid
    #c9c9c9;border-radius:3px}#divbold:hover,#divcolor:hover,#divitalic:hover,#divsmilies:hover,#divstrike:hover,#divunderline:hover{background:url(http://i25.servimg.com/u/f25/14/45/99/41/hover10.jpg)
     repeat-x;border:1px solid
    #a2a2a2}#divbold:active,#divcolor:active,#divitalic:active,#divsmilies:active,#divstrike:active,#divunderline:active{background:url(http://i25.servimg.com/u/f25/14/45/99/41/active10.jpg)
     repeat-x}label
    input#message{-moz-border-radius:3px;background-color:#fff;border:1px
    solid #c9c9c9;border-radius:3px;font-size:12px;height:17px}label
    input#message:hover{background-color:#f5f5f5;border:1px solid
    #b2b2b2}label input#message:focus{background-color:#e0fdff;border:1px
    solid
    #a4a4a4}input#submit_button{-moz-border-radius:3px;background:url(http://i25.servimg.com/u/f25/14/45/99/41/110.jpg)
     repeat-x;background-color:#fff;border:1px solid
    #c9c9c9;border-radius:3px;color:#929292;cursor:pointer;font-family:Arial
     
    #000;font-size:12px;padding-left:2px;padding-right:2px;text-transform:uppercase}input#submit_button:hover{background:url(http://i25.servimg.com/u/f25/14/45/99/41/hover10.jpg)
     repeat-x;border:1px solid
    #a2a2a2;color:#2c2c2c}input#submit_button:active{background:url(http://i25.servimg.com/u/f25/14/45/99/41/active10.jpg)
     
    repeat-x}.right{padding-top:4px!important}#chatbox_footer{border:0!important}.score{padding-top:20px}.pnsmall{font-size:10px;font-style:italic;margin-top:-5px}.tipsy{font-size:10px;padding:5px;position:absolute;z-index:999}.tipsy-inner{-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#000;border-radius:3px;color:#FFF;max-width:200px;padding:5px
     8px 4px;text-align:center}.tipsy-arrow{border:5px dashed
    #000;height:0;line-height:0;position:absolute;width:0}.tipsy-arrow-n{border-bottom-color:#000}.tipsy-arrow-s{border-top-color:#000}.tipsy-arrow-e{border-left-color:#000}.tipsy-arrow-w{border-right-color:#000}.tipsy-n
     
    .tipsy-arrow{border-bottom-style:solid;border-left-color:transparent;border-right-color:transparent;border-top:none;left:50%;margin-left:-5px;top:0}.tipsy-nw
     
    .tipsy-arrow{border-bottom-style:solid;border-left-color:transparent;border-right-color:transparent;border-top:none;left:10px;top:0}.tipsy-ne
     
    .tipsy-arrow{border-bottom-style:solid;border-left-color:transparent;border-right-color:transparent;border-top:none;right:10px;top:0}.tipsy-s
     
    .tipsy-arrow{border-bottom:none;border-left-color:transparent;border-right-color:transparent;border-top-style:solid;bottom:0;left:50%;margin-left:-5px}.tipsy-sw
     
    .tipsy-arrow{border-bottom:none;border-left-color:transparent;border-right-color:transparent;border-top-style:solid;bottom:0;left:10px}.tipsy-se
     
    .tipsy-arrow{border-bottom:none;border-left-color:transparent;border-right-color:transparent;border-top-style:solid;bottom:0;right:10px}.tipsy-e
     
    .tipsy-arrow{border-bottom-color:transparent;border-left-style:solid;border-right:none;border-top-color:transparent;margin-top:-5px;right:0;top:50%}.tipsy-w
     
    .tipsy-arrow{border-bottom-color:transparent;border-left:none;border-right-style:solid;border-top-color:transparent;left:0;margin-top:-5px;top:50%}.warning2{-moz-border-radius:10px;-moz-box-shadow:1px
     1px 10px red;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
     
    red;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/error10.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:red;border-radius:10px;box-shadow:1px 1px 10px
    red;color:red;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.lock2{-moz-border-radius:10px;-moz-box-shadow:1px 1px
    10px blue;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
    blue;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/lock10.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:blue;border-radius:10px;box-shadow:1px 1px 10px
    blue;color:blue;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.yes2{-moz-border-radius:10px;-moz-box-shadow:1px 1px
    10px green;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
    green;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/accept11.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:green;border-radius:10px;box-shadow:1px 1px 10px
    green;color:green;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.tag2{-moz-border-radius:10px;-moz-box-shadow:1px 1px
    10px orange;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
    orange;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/link_a10.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:orange;border-radius:10px;box-shadow:1px 1px 10px
    orange;color:orange;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.move2{-moz-border-radius:10px;-moz-box-shadow:1px 1px
    10px #4b0082;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
    #4b0082;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/page_w10.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:#4b0082;border-radius:10px;box-shadow:1px 1px 10px
    #4b0082;color:#4b0082;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.ban2{-moz-border-radius:10px;-moz-box-shadow:1px 1px
    10px #000;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
    #000;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/set_se10.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:#000;border-radius:10px;box-shadow:1px 1px 10px
    #000;color:#000;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.tum2{-moz-border-radius:10px;-moz-box-shadow:1px 1px
    10px #a52a2a;-webkit-border-radius:10px;-webkit-box-shadow:1px 1px 10px
    #a52a2a;background-color:transparent;background-image:url(http://i47.servimg.com/u/f47/16/97/26/79/thumb_10.png);background-position:10px
     center;background-repeat:no-repeat;border:1px
    solid;border-color:#a52a2a;border-radius:10px;box-shadow:1px 1px 10px
    #a52a2a;color:#a52a2a;font-family:Lobster;font-size:15px;font-style:normal;font-weight:400;margin:10px
     auto;padding:15px 10px 15px
    70px;width:90%}.chienthan{background:#000;border-radius:0 0 2px
    2px;height:4px}.chatbox_row_1{background-color:transparent;padding:4px}.chatbox_row_2{background-color:transparent;padding:4px}#chatbox_members
     
    .member-title{background-color:#000;background-image:none;color:#FCD424;font-family:Verdana,Arial,Helvetica,sans-serif;font-size:12px;padding:.5em
     .25em;text-align:center}
    NGUỒN -> CLICK VÀO ĐÂY


    Tags: #Code #chatbox-đẹp-forumotion

  • Ông Sói
    cái này nên ghi tile là CSS làm đẹp chatbox mặc định nhé

  • dksFeed
    3. Re: [Code] Làm đẹp chatbox mặc định cho Forumotion !
    avatar MEM LV3
    The Kai đã viết:cái này nên ghi tile là CSS làm đẹp chatbox mặc định nhé
    à mình k bik ^^ , cảm ơn bạn

  • Edo
  • dksFeed
    5. Re: [Code] Làm đẹp chatbox mặc định cho Forumotion !
    avatar MEM LV3
    @Edo đã viết:lâu rôi mah
    thì sao?


    --Chữ ký--
  • Edo
  • dksFeed
    7. Re: [Code] Làm đẹp chatbox mặc định cho Forumotion !
    avatar MEM LV3
    @Edo đã viết:thi ko có gi
    ờh

  • Sponsored content

Thông tin tác giả
avatar
MEM LV3
Bài viết :
154
Points :
238
Like :
26
Punbb
Status :
Rất vui khi được tham gia cùng HotroFM !
Xem lý lịch thành viên http://9fgame.forumvi.com/
Thông tin tác giả
avatar
MOD
Bài viết :
110
Points :
206
Like :
40
PhpBB3
An toàn
Status :
Cu To
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM LV3
Bài viết :
154
Points :
238
Like :
26
Punbb
Status :
Rất vui khi được tham gia cùng HotroFM !
Xem lý lịch thành viên http://9fgame.forumvi.com/
Thông tin tác giả
avatar
MEM LV1
Bài viết :
13
Points :
15
Like :
0
PhpBB3
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM LV3
Bài viết :
154
Points :
238
Like :
26
Punbb
Status :
Rất vui khi được tham gia cùng HotroFM !
Xem lý lịch thành viên http://9fgame.forumvi.com/
Thông tin tác giả
avatar
MEM LV1
Bài viết :
13
Points :
15
Like :
0
PhpBB3
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM LV3
Bài viết :
154
Points :
238
Like :
26
Punbb
Status :
Rất vui khi được tham gia cùng HotroFM !
Xem lý lịch thành viên http://9fgame.forumvi.com/
Thông tin tác giả
Sponsored content
Bài viết liên quan
    Đang tải dữ liệu

Permissions in this forum:
Bạn không có quyền trả lời bài viết