* { padding: 0; margin: 0; } .w { width: 1200px; margin: auto; } body { background-color:#f3f5f7; } body .zo { position: fixed; top: 100px; left: 0; } body .yo { position: fixed; top: 100px; right: 0; } li { list-style: none; } a { text-decoration: none; } .clearfix:before,.clearfix:after { content:""; display: table; } .clearfix:after{ clear: both; } .clearfix { *zoom:1; } /*头部*/ .headr { height: 42px; /*background-color: pink;*/ margin: 30px auto; } .logo { float: left; width: 198px; height: 42px; /*background-color: aqua;*/ } .nav { float: left; margin-left: 60px; } .nav ul li { float: left; margin: 0 15px; } .nav ul li a { display: block; height: 42px; padding: 0 10px; line-height: 42px; font-size: 18px; color: black; } .nav ul li a:hover{ border-bottom: 2px solid blue; } .search { float: left; width: 412px; height: 42px; /*background-color: skyblue;*/ margin-left: 70px; } .search input { float: left; width: 345px; height: 40px; border: 1px solid deepskyblue; border-right: 0; font-size: 14px; color: gray; padding-left: 15px; } .search button { float: left; width: 50px; height: 42px; /*background-color: blue;*/ border: 0; background-image: url("image/fa-search.png"); } .user { float: right; line-height: 42px; margin-right: 50px; font-size: 14px; color: gray; } .user img { vertical-align: middle; } /*banner部分*/ .banner { height: 420px; background-color: #1c036c; } .banner .w { height: 420px; background: url("image/banner2.png") no-repeat top center; } .subnav { float: left; height: 420px; width: 190px; background:rgba(0,0,0,.3); } .subnav ul li { height: 45px; line-height: 45px; padding: 0 20px; } .subnav ul li a { font-size: 14px; color: #fff; text-decoration: none; } .subnav ul li a:hover{ color: orange; } .subnav ul li a span { float: right; } .cpurse { float: right; width: 230px; height: 300px; background-color: #f3f5f7; margin-top: 50px; } .cpurse h2 { height: 50px; background-color: deepskyblue; text-align: center; line-height: 50px; font-size: 18px; color: #f3f5f7; } .bd { padding: 0 20px; } .bd ul li { padding: 14px 0; border-bottom: 1px solid gray; } .bd ul li h4{ font-size: 16px; } .bd ul li p { font-size: 12px; } .bd .moer { height: 40px; display: block; border: 1px solid deepskyblue; text-align: center; line-height: 40px; font-size: 16px; color: deepskyblue; font-weight:700; margin-top: 5px; background-color: #f3f5f7; } /*精品推荐模块*/ .jp { height: 60px; background-color: #f3f5f7; margin-top: 10px; box-shadow: 0 2px 3px 3px rgba(0,0,0,.1); line-height: 60px; } .jp h3 { float: left; margin-left: 30px; font-size: 16px; color: #00a4ff; } .jp ul { float: left; margin-left: 30px; } .jp ul li { float: left; } .jp ul li a { padding: 0 30px; font-size: 16px; color: black; border-left: 1px solid gray; } .jp .mod { float: right; font-size: 14px; color: #00a4ff; margin-right: 30px; } /*精品模块*/ .box { margin-top: 30px; } .box .box-hd { height: 45px; } .box .box-hd h3 { float: left; font-size: 20px; color: #00a4ff; } .box .box-hd a { float: right; font-size: 14px; color: #a5a5a5; margin-top: 1px; margin-right: 30px; } .box-bd ul { width: 1225px; } .box-bd ul li { float: left; width: 228px; height: 270px; margin-right: 15px; margin-bottom: 15px; background-color: #ffffff; } .box-bd ul li img { width: 100%; } .box-bd ul li h4 { margin: 20px 20px 20px 25px; font-size: 14px; font-weight: 400; } .info { margin: 0 20px 0 25px; font-size: 12px; color: #999; } .info span { color: orange; } /*数据模块*/ .sj { margin-top: 30px; } .sj .slug { height: 45px; } .slug h3 { float: left; font-size: 20px; font-weight: 400; } .slug ul { margin: 0 350px; } .slug ul li a { float: left; margin: 5px 35px 0 ; font-size: 16px; color: #868686; } .slug ul li a:hover{ color: #66bcfd; } .slug>a { float: right; margin-right: 30px; margin-top: 5px; font-size: 12px; color: #999999; } .mk .zuo { float: left; width: 230px; height: 400px; } .mk .zuo img { width: 100%; height: 100%; } .mk .you { float: right; width: 955px; height: 400px; margin-left: 3px; margin-bottom: 30px; } .mk .you .yous { height: 100px; margin-bottom: 22px; } .mk .you .youx { height: 270px; width: 1100px; } .youx ul li { float: left; margin-right: 13px; width: 228px; height: 277px; background-color: #fff; } .youx ul li img { width: 100%; } .youx ul li h4 { margin: 20px 20px 20px 25px; font-size: 14px; font-weight: 400; } .youx .info { margin: 0 20px 0 25px; font-size: 12px; color: #999; } .youx .info span { color: orange; } /*数据分析模块*/ .fx { margin-top: 20px; } .fx .fxsk { height: 45px; } .fx .fxsk h3 { float: left; font-size: 20px; font-weight: 400; } .fxsk ul { margin:0 350px; } .fxsk ul li a { float: left; font-size: 16px; margin: 0 35px; color: #868686; } .fxsk ul li a:hover{ color: #66bcfd; } .fxsk>a { float: right; margin-right: 30px; margin-top: 5px; font-size: 12px; color: #999999; } /*机器模块*/ .jq { margin-top: 20px; } .jq .jqsk { height: 45px; } .jq .jqsk h3 { float: left; font-size: 20px; font-weight: 400; } .jqsk ul { margin:0 350px; } .jqsk ul li a { float: left; font-size: 16px; margin: 0 35px; color: #868686; } .jqsk ul li a:hover{ color: #66bcfd; } .jqsk>a { float: right; margin-right: 30px; margin-top: 5px; font-size: 12px; color: #999999; } .jqxk ul li { float: left; margin-right: 13px; width: 228px; height: 277px; background-color: #fff; } .jqxk ul li img { width: 100%; } .jqxk ul { width: 1300px; } .jqxk ul li h4 { margin: 20px 20px 20px 25px; font-size: 14px; font-weight: 400; } .jqxk .info { margin: 0 20px 0 25px; font-size: 12px; color: #999; } .jqxk .info span { color: orange; } /*前段模块*/ .qd { margin-top: 20px; } .qd .jqsk { height: 45px; } .qd .jqsk h3 { float: left; font-size: 20px; font-weight: 400; } .jqsk ul { margin:0 350px; } .jqsk ul li a { float: left; font-size: 16px; margin: 0 35px; color: #868686; } .jqsk ul li a:hover{ color: #66bcfd; } .jqsk>a { float: right; margin-right: 30px; margin-top: 5px; font-size: 12px; color: #999999; } .jqxk ul li { float: left; margin-right: 13px; width: 228px; height: 277px; background-color: #fff; } .jqxk ul li img { width: 100%; } .jqxk ul { width: 1300px; } .jqxk ul li h4 { margin: 20px 20px 20px 25px; font-size: 14px; font-weight: 400; } .jqxk .info { margin: 0 20px 0 25px; font-size: 12px; color: #999; } .jqxk .info span { color: orange; } /*footer模块*/ .footer { height: 415px; background-color: #ffffff; margin-top: 30px; } .footer .w { padding-top: 30px; } .copyright{ float: left; } .links { float: right; } .copyright p { font-size: 12px; color: #666; margin-top: 22px; } .copyright a { height: 33px; width: 118px; display: block; border: 1px solid deepskyblue; text-align: center; line-height: 33px; font-size: 16px; color: deepskyblue; font-weight:700; margin-top: 20px; } .links dl { float: left; margin-left: 100px; } .links dl dt { font-size: 16px; color: #333; margin-bottom: 10px; } .links dl dd a { font-size: 12px; color: #333; }
学成网css
于 2022-04-14 15:30:08 首次发布