Newer
Older
/*================================================= Reset ============================================================*/
html {
color: #777;
background-color: #f1f1f1;
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, form, input, textarea, th, td {
margin: 0;
padding: 0;
box-sizing: border-box;
a {
text-decoration: none;
outline: none;
button, a:active, a:hover, a:focus, input {
outline: none;
input:required:invalid, input:focus:invalid {
box-shadow: none;
/* HTML5 标签支持 */
header, section, footer, aside, nav, article, figure {
display: block;
/* 依次为 macOS Windows Linux 字体回退 */
h1, h2, a, p, span, div {
font-weight: normal;
font-family: "Helvetica Neue", "Hiragino Sans GB", "微软雅黑", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
/*=============================================== END Reset ==========================================================*/
/*=================================================== 导航 ============================================================*/
.u_nav-wrapper {
position: fixed;
top: 0;
width: 100%;
background-color: white;
border-bottom: 1px #ccc solid;
z-index: 10;
}
.u_nav {
max-width: 1400px;
margin: auto;
}
.u_nav-left {
margin: 18px;
font-size: 16px;
.u_nav-right {
margin: 18px;
font-size: 14px;
.u_nav-left, .u_nav-input {
float: left;
.u_nav-right {
position: relative;
top: 3px;
float: right;
.u_nav-right > a {
margin-right: 20px;
.u_nav-input, .u_nav-btn {
float: left;
position: relative;
height: 38px;
top: 10px;
padding: 5px;
color: #777;
border: 1px lightgray solid;
.u_nav-input {
display: block;
width: 200px;
border-right: 0;
border-radius: 3px 0 0 3px;
/* PC 端搜索框组 */
.u_nav-btn {
font-size: 14px;
display: block;
width: 80px;
cursor: pointer;
line-height: 24px;
vertical-align: middle;
border-radius: 0 3px 3px 0;
.u_nav-ul {
position: relative;
top: 7px;
left: -6px;
width: 80px;
display: block;
background-color: white;
z-index: 5;
}
.u_nav-li {
font-size: 14px;
display: block;
height: 35px;
line-height: 30px;
vertical-align: middle;
.u_nav-btn > ul {
border: 0;
.u_nav-btn > ul > li {
display: none;
.u_nav-btn:hover {
border-bottom: 0;
.u_nav-btn:hover > ul {
border: 1px lightgray solid;
border-top: 0;
border-radius: 0 0 3px 3px;
.u_nav-btn:hover > ul > li {
display: block;
/* 移动端搜索框组 */
.um_nav-input-group {
display: none;
@media (max-width: 1000px) {
.u_nav-right,.u_nav-input-group {
display: none;
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
.um_nav-input-group {
display: block;
}
.um_nav-input, .um_nav-btn {
display: block;
height: 30px;
margin-bottom: 10px;
float: left;
color: #777;
padding: 5px;
border: 1px lightgray solid;
}
.um_nav-input {
margin-left: 15px;
width: 130px;
font-size: 12px;
border-radius: 3px 0 0 3px;
}
.um_nav-btn {
font-size: 12px;
width: 50px;
text-align: center;
cursor: pointer;
line-height: 20px;
vertical-align: middle;
border-left: 0;
border-radius: 0;
}
.um_nav-btn:last-child {
border-radius: 0 3px 3px 0;
/*================================================= END 导航 ==========================================================*/
/*=================================================== main ===========================================================*/
.u_main-wrapper {
max-width: 1200px;
margin: 60px auto auto auto;
.main-block {
margin: 10px 5px 5px 5px;
padding: 10px;
background-color: white;
.block-title {
display: block;
margin: 5px auto 10px 15px;
font-size: 18px;
color: #337ab7;
float: left;
width: 33%;
text-align: center;
height: 120px;
color: #666;
}
.grid-title {
display: block;
}
.grid-icon {
display: block;
.block-grid.new::before {
content: "new";
position: absolute;
top: -1em;
right: 0;
font-size: 0.75em;
padding: 0 0.5em;
border-radius: 1000px;
background-color: #777;
color: #fff;
/* 矢量图标 */
.icon {
position: relative;
top: 10px;
display: inline-block;
width: 50px;
height: 50px;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
}
.footer {
margin: 20px;
font-size: 14px;
color: #777;
.footer > a {
color: #337ab7;
@media (max-width: 1000px) {
.u_main-wrapper {
margin: 100px auto auto auto;
}
.main-col {
width: 100%;
}
/*================================================= END main =========================================================*/