/* * @Author: zyb * @Date: 2017-04-19 18:51:17 * @Last Modified by: zyb * @Last Modified time: 2017-04-22 14:07:53 */ /* 初始化标签样式 */ html, body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, nav, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, a, span, select, option { margin:0; padding:0; text-decoration: none;list-style: none;font-family: 'Microsoft Yahei'; } /* body */ body{ background: #EFF3F5; min-width: 1100px; } img{ cursor: pointer; } /* clearFloat */ .clearFloat{ clear: both; } /* header */ header { height:70px; background: rgba(0, 0, 0, 0); line-height: 70px; font-size: 14px; position: fixed; width: 100%; min-width: 950px; z-index: 99999; transition: all .3s linear; } header:hover{ background: white; } .headerWhite{ transition: all .35s linear; background: white; } /* 当前位置 */ header nav ul li select { width: auto; border: none; outline: none; height: 40px; border: 1px solid rgba(0, 0, 0, 0); background: rgba(0, 0, 0, 0) } header nav ul li select:hover { transition: all .2s linear; border-right: 1px solid lightgray; border-left: 1px solid lightgray; } /* Logo */ header img { margin-top: 10px; width: 50px; height: 50px; display: inline-block; float: left; border-radius: 50%; margin-left: 8%; } @media screen and (min-width:1200px){ header img { margin-left: 8%; } } @media screen and (min-width:1100px) and (max-width:1200px){ header img { margin-left: 7%; } } @media screen and (min-width:990px) and (max-width:1100px){ header img { margin-left: 5%; } } @media screen and (max-width:990px){ header img { margin-left: 3%; } } /* 分类 */ header ul { float: left; margin-left:3%; } header nav ul li { float: left; line-height: 70px; } header nav ul li:first-of-type{ padding: 0 15px 0 15px; } header nav ul li a { color: black; padding: 0 15px 0 15px; border-right: 1px solid rgba(0, 0, 0, 0); border-left: 1px solid rgba(0, 0, 0, 0); border-top: 5px solid rgba(0, 0, 0, 0); height: 65px; display: inline-block; line-height: 65px; } header nav ul li a:hover { transition: all .25s linear; border-top: 5px solid #3498db; border-right: 1px solid lightgray; border-left: 1px solid lightgray; } .aStyle{ color: skyblue; } /* 搜索及登录 */ header label{ line-height: 70px; float: right; margin-right: 8%; } @media screen and (min-width:1200px){ header label { margin-right: 8%; } } @media screen and (min-width:1100px) and (max-width:1200px){ header label { margin-right: 5%; } } @media screen and (min-width:990px) and (max-width:1100px){ header label { margin-right: 3%; } } @media screen and (max-width:990px){ header label { margin-right: 2%; } } header label input[type=search]{ border: 1px solid rgba(0, 0, 0, 0); outline: none; height: 40px; text-indent: 5px; background: rgba(0, 0, 0, 0); } header label input[type=search]:focus{ transition: all .2s linear; border-left: 1px solid lightgray; border-right: 1px solid lightgray; } header label .icon-search, header label .icon-chevron-up{ color: white; display: inline-block; padding: 13px; border-radius: 50%; background: lightsteelblue; cursor: pointer; } header label .icon-search:hover,header label .icon-chevron-up:hover{ transition: all .2s linear; background: #3498db; /* color: #3498db; */ } header label #login{ height: 65px; line-height: 65px; color: #3498db; display: inline-block; border-right: 1px solid rgba(0, 0, 0, 0); border-left: 1px solid rgba(0, 0, 0, 0); border-top: 5px solid rgba(0, 0, 0, 0); padding: 0 15px 0 15px; } header label #login:hover{ transition: all .25s linear; border-top: 5px solid #3498db; border-right: 1px solid lightgray; border-left: 1px solid lightgray; } /* footer */ #footer{ text-align: center; width: 100%; /* position: absolute; */ font-size: 14px; color: #979797; background: white; } #footer p{ text-align: center; } #footer p a{ padding: 10px; display: inline-block; } #footer p a:hover{ color: skyblue; } #footer a{ color:gray; } #footer li a:hover{ color:#0072E3; } /* login 弹窗的样式*/ .mytable{ width: 100%; border: none; } .mytable tr td:first-child{ text-align: center; padding:5px 0 5px 0; width: 20%; height: 30px; } .mytable tr td:last-child{ width: 80%; height: 30px; } .mytable tr td input{ width: 100%; height: 26px; border: 1px solid skyblue; border-radius: 13px; outline: none; text-indent: 15px; } .mytable tr .zhuce{ text-align: left; color: gray; } .mytable tr .zhuce small:hover{ color: lightskyblue; cursor: pointer; } /* main */ #main{ width: 74%; float: left; margin-bottom: 15px; } #tside, #cside, #dside{ margin-top: 20px; width: 100%; background: white; overflow: hidden; padding: 15px; } @media screen and (min-width:1200px){ #tside, #cside, #dside { width: 100%; } } @media screen and (min-width:1100px) and (max-width:1200px){ #tside, #cside, #dside { width: 99%; } } @media screen and (min-width:990px) and (max-width:1100px){ #tside, #cside, #dside { width: 98%; } } @media screen and (max-width:990px){ #tside, #cside, #dside { width: 98%; } } /* 每个模块的标题的样式 */ .subtitle{ height: 45px; width: 100%; margin-top: 5px; } .subtitle span{ float: left; margin-left: 10px; line-height: 36px; font-size: 25px; color:#5B5B5B; } .subtitle span a{ font-size: 14px; color: gray; padding: 0 8px 0 8px; } .subtitle span a:hover{ color: lightskyblue; } .subtitle p small{ float: right; cursor: pointer; } .subtitle p small:hover{ color: lightskyblue; } .three1{ height: 77%; width: 22%; margin:10px; float:left; } .three1 img{ margin-left: 5px; width: 100%; /* padding: 9px 9px 9px 9px; */ background: white; transition:all .25s linear; } .three1 img:hover{ transform:scale(1.1); } .three1 li{ padding-top: 9px; text-align: center; } .three1 a{ line-height: 36px; font-size: 16px; margin-left: 25px; color:#8E8E8E; } .three1 a:hover{ color: #6683FF; } #rside{ margin-top: 20px; width:20%; /* height:100%; */ float:right; background:white; overflow: hidden; padding: 15px; } #scrollDiv{ height: 300px; overflow: hidden; } #rside h1{ font-size: 25px; } #rside ul li img{ width: 50px; height: 50px; border-radius: 50%; } #rside ul li{ height: 60px; color: gray; } #rside ul li a{ float: right; width: 80%; font-size: 14px; color: gray; } /* 关注我们 */ .guanzhu{ width: 20%; float: right; background: white; padding: 15px; margin-top: 15px; } .guanzhu h2 { color: #5B5B5B; padding-bottom: 15px; } .guanzhu div img{ width: 20%; float: left; border-radius: 15px; margin: 5px; } /* 百度地图的样式 */ .map{ width: 20%; height: 250px; float: right; background: white; padding: 15px; margin-top: 15px; margin-bottom: 15px; } #allmap { width: 100%; height: 200px; overflow: hidden; margin:0; font-family:"微软雅黑";} .map h2{ color: #5B5B5B; padding-bottom: 15px; }