![[Share] Khung đăng nhập VIP hotrofm đang dùng 311259195mz0gpsd_zps45a00772](https://2img.net/h/i1256.photobucket.com/albums/ii492/pecaoxinh/311259195mz0gpsd_zps45a00772.gif?t=1391170238)
Cho vào Header:
- Code:
<!-- BEGIN switch_user_logged_out -->
<script src="http://www.maikhongquen.com/16467.js" type="text/javascript"></script><div id="rep-mail-bar"><div id="toppanel"><div id="panel" style="display: none; "><div class="content clearfix"><div class="left"><h1>Welcome to Hotrofm.com</h1><h2>Cảm ơn bạn đã truy cập diễn đàn !</h2><p class="grey">Code cực hay, Kho skin cực khủng, Index cực đẹp, Giải đáp thắc mắc cực nhanh...<br>Chỉ có tại Hotrofm.com - Tham gia ngay !</p><h2>Lưu ý:</h2><p class="grey">► Hiển thị tốt nhất trên <a href="https://www.google.com/chrome/index.html?hl=vi&brand=CHMA&utm_campaign=vi&utm_source=vi-ha-apac-vi-bk&utm_medium=ha&installdataindex=homepagepromo" title="Download Google Chrome">Google Chrome</a> và<a href="http://www.mozilla.org/vi/firefox/new/" title="Download FireFox"> FireFox</a> •<br><br><a style="padding: 0 5px" title="Gửi trang này cho bạn bè qua yahoo !" href="ymsgr:im?+&msg=Trang này hỗ trợ Forumotion tốt lắm: http://hotrofm.com/"><img border="0" src="http://i48.servimg.com/u/f48/16/58/89/73/yahoo10.png"><a style="padding: 0 5px" target="_blank" href="http://link.apps.zing.vn/share?url=http://hotrofm.com/&t=hotrofm&desc=&images=http://i48.servimg.com/u/f48/17/18/68/12/logo_v10.png&media=&width=0&height=0" title="Chia sẻ lên Zing Me"><img src="http://i48.servimg.com/u/f48/16/58/89/73/zing10.png"></a><a style="padding: 0 5px" target="_blank" href="http://my.go.vn/GoShare.aspx?url=http://hotrofm.com/&title=hotro5&picture=http://i48.servimg.com/u/f48/17/18/68/12/logo_v10.png&message=" title="Chia sẻ lên Go.vn"><img src="http://my.go.vn/img/go.vn20x20.gif"></a><a style="padding: 0 5px" target="_blank" href="https://www.google.com.vn/bookmarks/mark?op=edit&output=popup&bkmk=http://hotrofm.com/&title=hotrofm&annotation=" title="Chia sẻ lên Google"><img src="http://i48.servimg.com/u/f48/16/58/89/73/bookma10.gif"></a><a style="padding: 0 5px" target="_blank" href="http://linkhay.com/submit?link_url=http://hotrofm.com/&link_title=hotrofm" title="Chia sẽ lên Link hay"><img src="http://linkhay.com/templates/images/guide/button5.jpg"></a><a style="padding: 0 5px" target="_blank" href="http://www.facebook.com/share.php?u=http://hotrofm.com/" title="Chia sẽ lên Facebook"><img src="http://i48.servimg.com/u/f48/16/58/89/73/facebo10.png"></a><a style="padding: 0 5px" target="_blank" href="http://twitter.com/share?url=http://hotrofm.com/&via=AddThis&text=hotrofm" title="Chia sẻ lên Twitter"><img src="http://i48.servimg.com/u/f48/16/58/89/73/01690_10.png"></a></a><br></a></p></div><div class="left"><form action="/login?redirect=/" method="post" name="form_login" id="login-vds"><h1 class="padlock">Đăng nhập</h1><label class="grey" for="log">Tài khoản:</label><input class="field" id="log" type="text" size="10" name="username"><label class="grey" for="pwd">Mật khẩu:</label><input class="field" id="pwd" type="password" size="10" name="password"><input id="bt_login" class="bt_login" type="submit" name="login" value="Login"><label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever"> Remember me</label><div class="clear"></div></form><script type="text/javascript">//<![CDATA[
$(function(){$('#login-vds').attr('action','/login?redirect='+this.location.pathname);});//]]></script></div><div class="left right"><form action="/register?agreed=true&step=2" method="post"><h1>Đăng ký nhanh !</h1><label class="grey" for="signup">Tên truy cập : *</label><input class="field" type="text" id="username_reg" name="username" value="" size="25" maxlength="25"><label class="grey" for="email">Email:</label><input class="field" type="text" name="email" id="email" size="23"><label class="grey" for="signup">Mật khẩu : *</label><input class="field" type="password" id="password_reg" name="password" value="" size="25" maxlength="25"><input type="submit" name="submit" value="Register" class="bt_register"></form></div></div></div><!--
/login --><!--
The tab on top --><div class="tab"><ul class="login"><li class="left"> </li><li>Chào bạn !</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#" style="display: block; ">Đăng nhập | Đăng ký</a><a id="close" style="display: none; " class="close" href="#">Close | Đóng lại</a></li><li class="right"> </li></ul> </div><!--
/ top --></div></div>
<!-- END switch_user_logged_out -->
- Code:
/* Panel Tab/button */
.tab {
background: url(http://i.imgur.com/fDQkE.png) repeat-x 0 0;
height: 22px;
position: relative;
top: 0;
z-index: 999;
}
.tab ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 42px;
width: auto;
font-weight: bold;
line-height: 42px;
margin: 0;
right: 150px;
color: white;
font-size: 80%;
text-align: center;
}
.tab ul.login li.left {
background: url(http://i.imgur.com/XwNu2.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}
.tab ul.login li.right {
background: url(http://i.imgur.com/QmQzs.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}
.tab ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 42px;
background: url(http://i.imgur.com/PAFBM.png) repeat-x 0 0;
}
.tab ul.login li a {
color: #15ADFF;
}
.tab ul.login li a:hover {
color: white;
}
.tab .sep {color:#414141}
.tab a.open, .tab a.close {
height: 20px;
line-height: 20px !important;
padding-left: 30px !important;
cursor: pointer;
display: block;
width: 100px;
position: relative;
top: 11px;
width: 120px;
}
.tab a.open {background: url(http://i.imgur.com/NWFec.png) no-repeat left 0;}
.tab a.close {background: url(http://i.imgur.com/GGiBD.png) no-repeat left 0;}
.tab a:hover.open {background: url(http://i.imgur.com/mboPc.png) no-repeat left -19px;}
.tab a:hover.close {background: url(http://i.imgur.com/xztqF.png) no-repeat left -19px;}
/* sliding panel */
#toppanel {
position: absolute; /*Panel will overlap content */
/*position: relative;*/ /*Panel will "push" the content down */
top: 0;
width: 100%;
z-index: 999;
text-align: center;
margin-left: auto;
margin-right: auto;
}
#panel {
width: 100%;
height: 210px;
color: #999999;
background: #272727;
overflow: hidden;
position: relative;
z-index: 3;
display: none;
}
#panel h1 {
font-size: 1.6em;
padding: 5px 0 10px;
margin: 0;
color: white;
}
#panel h2{
font-size: 1.2em;
padding: 10px 0 5px;
margin: 0;
color: white;
}
#panel p {
margin: 5px 0;
padding: 0;
}
#panel a {
text-decoration: none;
color: #15ADFF;
}
#panel a:hover {
color: white;
}
#panel a-lost-pwd {
display: block;
float: left;
}
#panel .content {
width: 960px;
margin: 0 auto;
padding-top: 15px;
text-align: left;
font-size: 0.85em;
}
#panel .content .left {
width: 280px;
float: left;
padding: 0 15px;
border-left: 1px solid #333;
}
#panel .content .right {
border-right: 1px solid #333;
}
#panel .content form {
margin: 0 0 10px 0;
}
#panel .content label {
float: left;
padding-top: 2px;
clear: both;
width: 280px;
display: block;
}
#panel .content input.field {
border: 1px #1A1A1A solid;
background: #414141;
margin-right: 5px;
margin-top: 4px;
width: 200px;
color: white;
height: 16px;
}
#panel .content input:focus.field {
background: #545454;
}
/* BUTTONS */
/* Login and Register buttons */
#panel .content input.bt_login,
#panel .content input.bt_register {
display: block;
float: left;
clear: left;
height: 24px;
text-align: center;
cursor: pointer;
border: none;
font-weight: bold;
margin: 10px 0;
}
#panel .content input.bt_login {
width: 74px;
background: transparent url(http://i.imgur.com/6E0rz.png) no-repeat 0 0;
}
#panel .content input.bt_register {
width: 94px;
color: white;
background: transparent url(http://i.imgur.com/sxtfY.png) no-repeat 0 0;
}
#panel .lost-pwd {
display: block;
float:left;
clear: right;
padding: 15px 5px 0;
font-size: 0.95em;
text-decoration: underline;
}
.main .tieude .page-title{color:#fff!important;background:#fff;opacity:0.8}
.main .tieude {
height: 28px;
padding: 6px;
border: 4px solid
#DAD3D3;
-webkit-box-shadow: 0 2px 2px -2px
rgba(0, 0, 0, .52);
font-size: 12px;
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-weight: 700;
background-color:
#DAD3D3;
color:
black;
}
.pun div, .pun td, .sig-line {
border-color: #
#DDD;
color: #
#DDD;
}
.main .tieude .page-title{padding: 5px;}.noidungthongbao{padding: 0px;height:27px!important}
a {
cursor: pointer;
color:
#3B5998;
text-decoration: none;
}
