黑马demo邮箱登录窗口附带码

我的邮箱

• 收件箱 32
• 红旗邮件 7
• 已发送 0/17
• 已删除 5
• 所有邮件

html,body,div,span,h1,a,ul,li,nav{
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
body{
line-height: 3em;
background: #F4F4F4;
font-family: Arial,sans-serif;
font-size: 14px;
font-weight: lighter;
}
.l-main{
width: 530px;
margin: 0 auto;
}
.menu{
width: 250px;
margin: 40px;
background: #fff;
box-shadow: 0 1px 4px rgba(0,0,0,0.3);
border-radius: 5px;
float: left;
}
.menu_header{
background: #4B4F55;
border-bottom: 1px solid #353A40;
border-radius: 5px 5px 0 0;
}
.menu_header-title{
color: #fff;
padding: 15px;
text-shadow: 0 1px 0 rgba(0,0,0,0.4);
}
.menu_body{
border-radius: 0 0 5px 5px;
}
.nav{
list-style: none;
}
.nav_item{
position: relative;
}
.nav_item-link{
padding: 10px 15px;
text-decoration: none;
color: #8B8E93;
display: block;
border-bottom: 1px solid #F0F0F0;
}
.nav_item-link:hover{
background: #f0f0f0;
}
.nav_item-link.is-active{
background: #6E757F;
color: #fff;
border-bottom-color: #4B4F55;
box-shadow: 0 1px 0 #7A828D inset;
}
.nav_item-link.is-active:after{
content: ‘’;
display: block;
position: absolute;
top: 50%;
right: -6px;
margin-top: -6px;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid #6E757F;
}
.nav_item-link.is-active{
color: #fff;
}
.nav_item:last-child .nav_item-link{
border-bottom: none;
}
.nav_item-icon{
width: 20px;
text-align: center;
font-size: 18px;
margin-right: 10px;
}
.badge{
font-size: 12px;
padding: 2px 8px;
border: 1px solid #D1D1D1;
border-radius: 10px;
position: absolute;
top: 10px;
right: 15px;
}
.badge–warning{
background: #ED373F;
border-color: #ED373F;
}
.fa-flag{
color: red;
}
.fa-space-shuttle{
color: #508049;
}
.fa-archive{
color: orange;
}
.fa-envelope{
color: #35b3ff;
}