/* -moz-:代表firefox(火狐)浏览器私有属性 -ms-:代表ie浏览器私有前缀 -webkit-:代表safari、chrome私有属性 -o-:代表Opera私有属性 */ * { /* 清除内边距 */ padding: 0; /* 清除外边距 */ margin: 0; /* css3盒子模型 */ box-sizing: border-box; /* 取消轮廓 */ outline: none; /* 去掉默认外观 */ -webkit-appearance: none; /* 去掉点击时的默认外观 */ outline-style: none; /* 去除点击出现背景 */ -webkit-tap-highlight-color:transparent; } body { /* 设置字体 */ font: 16px/1.5 Microsoft YaHei, PingFang SC, Heiti SC, Arial, SimHei, Hiragino Sans GB, Helvetica, "\5B8B\4F53", serif, sans-serif; /* 设置行高 */ line-height: 1.5; /* 设置颜色 */ color: #333333; /* 抗锯齿性-让文字显示的更加清晰 */ -webkit-font-smoothing: antialiased; } em,i{ /* 取消文字倾斜 */ font-style: normal; } ul,ol,li { /* 去掉小圆点 */ list-style: none; } button { /* 当我们鼠标经过button按钮的时候,鼠标变成小手 */ cursor: pointer; } img { /* 照顾低版本浏览器 如果图片外面包含了链接会有边框的问题 */ border: 0; /* 取消图片底侧有空白缝隙的问题 ① */ vertical-align: middle; /* 取消图片底侧有空白缝隙的问题 ② */ object-fit: cover; user-select: none; } a,ins { /* 去掉a标签的下划线 */ text-decoration: none; /* 手机端去除a标签点击时的背景样式 */ -webkit-tap-highlight-color: transparent; } a { /* 修改颜色 */ color: #333333; } img,a { /* 禁用长按时弹出的菜单 */ -webkit-touch-callout: none; } button,input,textarea { /* 设置字体 */ font-family: Microsoft YaHei, Heiti SC, PingFang SC, Arial, SimHei, Hiragino Sans GB, Helvetica, "\5B8B\4F53", serif, sans-serif; /* 取消轮廓 */ outline: none; /* 去掉默认外观 */ -webkit-appearance: none; /* 去掉点击时的默认外观 */ outline-style: none; } textarea { /* 禁止自定义拉伸 */ resize: none; } /* 清楚浮动 */ .clearfix:after { visibility: hidden; clear: both; display: block; content: "."; height: 0 } .clearfix { *zoom: 1 } /* 字体颜色 */ .color-99{ color: #999999; } .color-66{ color: #666666; } .color-33{ color: #333333; } .color-coffee{ color: #6e4e1f } .color-white{ color: #ffffff; } .color-orange{ color: #fe8917; } .color-blue{ color: #0e357f; } /* 背景颜色 */ .bg-col-orange{ background-color: #fe8917; } .bg-col-blue{ background-color: #0e357f; } .bg-col-white{ background-color: #ffffff; } .bg-col-f5{ background-color: #f5f5f5; } /* 控制显示文字行数 */ .clips1 { display: -webkit-box; -webkit-line-clamp: 1; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .clips2 { display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .clips3 { display: -webkit-box; -webkit-line-clamp: 3; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .clips4 { display: -webkit-box; -webkit-line-clamp: 4; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .clips5 { display: -webkit-box; -webkit-line-clamp: 5; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .clips6 { display: -webkit-box; -webkit-line-clamp: 6; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .clips7 { display: -webkit-box; -webkit-line-clamp: 7; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } /* 页面宽度 */ .w100 { width: 100%; } .w1360 { width: 1360px; margin: auto; } /* flex布局 */ .flex{ display: flex; } /* 英文大小写 */ .uppercase{ text-transform: uppercase; /* 大写 */ } .lowercase{ text-transform: lowercase; /* 小写 */ } .capitalize{ text-transform: capitalize; /* 首字母大写 */ } /* 顶部距离 */ .pull-margin{ margin-top: 88px; } /* 加载字体 */ @font-face{ font-family: 'helvetica'; src:url("../fonts/Helvetica.ttf"); } .font-helvetica{ font-family: 'helvetica'; }