python 打印机 纸盒_Python——前端之抽屉首页详解

/*======================================初始化=====================*/

*{

margin: 0;

padding: 0;

}

body{

font-size: 12px;

}

a{

text-decoration: none;

}/*======================================header区域设置=====================*/.header{

height: 44px;

width:100%;

background-color: #2459a2;

position: fixed;

top:0;

left: 0;

}

.header_content{

width:80%;

height: 44px;

background-color: #2459a2;

margin: 0 auto;

line-height: 44px;

position: relative;

}/*======header区part1:logo ===========*/.logo{

float: left;

width: 121px;

height: 23px;

margin-top: 9px;

}/*======header区part2:action-menu =====*/.action-menu{

float: left;

margin-left: 30px;

}

.action-menu a.tb{

color:#c0cddf;

padding: 12px 13px 12px 16px;/*float: left;*/

/*display: inline-block;*/}

.action-menu a.tb:hover {

color:#fff;

background-color: lightslategrey;

}

.action-menu a.active, .action-menu a.active:hover {

color:#fff;

background-color:#204982;;

}/*======header区part3:key-search =====*/.key-search{

margin-top: 5px;

float: right;

}

.key-search a.search-icon-box, .search-txt {

float: left;

}

.search-txt {

color:#333;

line-height: 25px;

padding: 2px 2px 2px 5px;

height: 25px;

width: 91px;

}

.key-search a.search-icon-box {

border: 1px solid#e0e0e0;

background-color: #f4f4f4;

width: 30px;

height: 31px;

border-left: 0;

}

.key-search a.search-icon-box span.search-icon{

background: url("images/icon.png") no-repeat 0 -197px;

float: left;

height: 12px;

width: 11px;

margin-left: 10px;

margin-top: 9px;

}/*======header区part4:action-nav =====*/.action-nav {

float: right;

margin-right: 10px;

}

.action-nav a {

color:#fff;

padding: 14px 18px;

}

.action-nav a:hover{

background-color: lightslategrey;

color: white;

}/*======================================content区域设置=====================*/.content-box {

background-color: #ededed;

padding-top: 44px;

height:100%;

}

.content {

width: 960px;

margin: 0 auto;

height: auto!important;

overflow: hidden;

min-height: 713px;

padding: 6px 28px;

background-color: #fff;

/*overflow: hidden;取消后看看效果*/}

.content-L {

width: 630px;

margin-top: 5px;

float: left;

border: dashed 2px darkorange;

}

.content-R {

width: 300px;

margin-top: 5px;

float: left;

}/*======content区域设置part1: toparea =====*/.top-area {/*overflow: hidden清除浮动*/

/*overflow: hidden;*/border-bottom: 1px solid #ccdcef;

}

.part1, .part2 {

float: left;

padding: 10px;

}

.part1 .hotbtn {

margin-left: 5px;

}

.part1 a {

display: inline-block;

width: 60px;

height: 26px;

line-height: 26px;

margin-top: 3px;

color:#369;

font-weight: 700;

text-align: center;

}

.part1 .active {

background: url('images/tip.png') no-repeat 0 -299px;

color:#333;

text-decoration: none;

}

.part2 {

margin-left: 100px;

margin-top: 6px;

border: 1px solid lightcoral;

}

.part2 .active {

color:#b4b4b4;

}

.part2 a {

margin-left: 10px;

color:#390;

}

.part3 {

float: right;

background-color: #84a42b;

border: 1px solid #8aab30;

color: #fff;

height: 30px;

line-height: 30px;

text-align: center;

width: 134px;

font-size: 14px;

margin-top: 10px;

}/*======content区域设置part2: article-list =====*/.article-list .item {

padding-top: 10px;

border-bottom: 1px solid #dce7f4;

/*清除浮动*/

/*overflow: hidden;*/}

.item .news-pic {

float: right;

margin-top: 25px;

width:11%;

border: 1px solid rebeccapurple;

text-align: center;

}

.item .news-content{

float: left;

width:87%;

border: 1px solid darkcyan;

}

.news-pic img{

width: 60px;

height: 60px;

}

.news-content .content-text{

line-height: 24px;

margin-top: 20px;

margin-left: 15px;

}

.news-content .content-text:hover a{

text-decoration: underline;

}

.content-text a{

font-size: 14px;

color:#369;

font-weight: 700;

}

.news-content .content-icon{

padding-top: 6px;

color:#ccc;

margin-bottom: 12px;

}

.content-source{

color:#b4b4b4;

margin-left: 7px;

}/*==========content-icon 设置hand-icon=========*/.hand-icon {

background: url("images/icon_18_118.png") no-repeat 0 0;

}

.content-icon .icon-recommend {

display: inline-block;

background-position: 0 -40px;

width: 18px;

height: 18px;

}

.content-icon .icon-recommend:hover{

background-position: 0 -20px;

}

.content-icon .icon-discuss {

display: inline-block;

background-position: 0 -100px;

width: 18px;

height: 18px;

vertical-align: -1px;

}

.content-icon .icon-discuss:hover{

background-position: 0 -80px;

}

.content-icon .icon-collect {

display: inline-block;

background-position: 0 -160px;

width: 18px;

height: 18px;

}

.content-icon .icon-collect:hover{

background-position: 0 -120px;

}/*调节图标的位置*/.content-icon a {

margin-left: 10px;

color:#99aecb;

}

.content-icon b,.content-icon .time-into i,.share-site-to i {

vertical-align: 4px;

font-weight: 800;

}/*==========content-icon 设置share-site-to=========*/.share-site-to{

float: right;

display: none;

margin-right: 10px;

}

.share-site-to .share-icon a {

background: url("images/share_icon.png") no-repeat 0 0;

width: 13px;

height: 13px;

display: inline-block;

margin-right: 2px;

margin-top: 2px;

opacity: .3;

}

.share-site-to .share-icon a.icon-sina {

background-position: 0 -90px;

width: 17px;

height: 14px;

}

.share-site-to .share-icon a.icon-douban {

background-position: 0 -105px;

}

.share-site-to .share-icon a.icon-qqzone {

background-position: 0 -120px;

width: 16px;

height: 14px;

}

.share-site-to .share-icon a.icon-tenxun {

background-position: 0 -136px;

}

.share-site-to .share-icon a.icon-renren {

background-position: 0 -151px;

}

.share-site-to .share-icon a:hover{

opacity: .9;

}

.item:hover .share-site-to{

display: block;

}

.share-site-to .share-icon {

vertical-align: 2px;

}

.content-icon .time-into .time-a{

color:#e59373;

}/*================================设置page样式====================*/.page-area ul li{

list-style: none;

display: inline-block;

}

.page-area ul li a,.current_page{

list-style: none;

display: inline-block;

color:#369;

padding: 10px 15px;

border-radius: 15%;

border: 1px solid#e1e1e1;

margin-left: 3px;

}

.page-area{

padding-top: 20px;

padding-bottom: 10px;

}

.page-area ul li .current_page{

border: none;

font-weight: 800;

}

.page-area ul li a:hover{

color:#fff;

background-color: #2459a2;

}/*==================================footer区域设置=================*/.footer-box{

margin: 0 auto;

width: 1020px;

background-color: #fff;

border-top:1px solid #dce7f4;;

}

.footer-box .foot-nav {

padding-top: 15px;

text-align: center;

border-top: 1px solid #ccdcef;

/*position: relative;*/}

.footer-box .foot-nav2 {

margin-top: 6px;

margin-bottom: 15px;

text-align: center;

}

.foot_b {

color:#999;

font-size: 12px;

}

.clearfix:after{

display: block;

content:"";

clear: both;

}