css

155 阅读1分钟

asd.scss

@charset "utf-8";

@import "asd_main";
/*=========================Reset_start==========================*/
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
p,
dl,
dt,
dd,
ol,
ul,
li,
form,
table,
th,
td,
a,
img,
span,
strong,
var,
em,
input,
textarea,
select,
option {
  margin: 0;
  padding: 0;
}

/*@font-face{
  font-family: 'PingFang Medium';
  src:url('../fonts/PingFang Medium.ttf') format('truetype');
}*/

html,
body {
  font: 12px/1.5 MicrosoftYaHei, tahoma, arial, Hiragino Sans GB, \\5b8b\4f53, sans-serif;
  background: #ffffff;
  position: relative;
  z-index: 10;
  color: #000000;
  width: 100%;
  min-height: 100%;
}

ul,
ol {
  list-style: none;
}

img {
  border: 0;
}

input,
select,
textarea {
  outline: 0;
}

textarea {
  resize: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

th,
strong,
var,
em {
  font-weight: normal;
  font-style: normal;
}

a {
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}

a:active,
a:focus,
a:visited {
  color: #232323;
}

pre {
  white-space: pre-wrap;
  word-wrap: break-word;
}

a:link, a:visited, a:hover, a:active {
  text-decoration: none;
}

body {
  /*Webkit 实现了名为-webkit-font-smoothing的相似属性。这个属性仅在 Mac OS X/macOS 下生效。。 - 平滑像素级别的字体,而不是子像素。从亚像素渲染切换到黑暗背景上的浅色文本的抗锯齿使其看起来更轻。 */
  -webkit-font-smoothing: antialiased;
  /*Firefox 实现了名为 -moz-osx-font-smoothing 的相似属性。这个属性仅在 Mac OS X / macOS 下生效。 - 用灰度抗锯齿渲染文本,而不是子像素。从亚像素渲染切换到黑暗背景上的浅色文本的抗锯齿使其看起来更轻。 */
  -moz-osx-font-smoothing: grayscale;
}

html {
  -webkit-text-size-adjust: none;
}
/*==========================Reset_End===========================*/

asd_main

/*----------设置公共样式-----------*/
//最大宽度
$maxWidth: 1200px;
//主体颜色
$mainColor: #0091EA;
/*文字*/
@mixin writtenWords($line-height) {
  font-size: 12px;
  font-weight: 400;
  color: #666666;
  line-height: $line-height;
}

/*内容宽度设定*/
@mixin content($mt, $mr, $mb, $ml) {
  max-width: $maxWidth;
  margin: $mt $mr $mb $ml;
}

/*flex设定*/
@mixin displayiFlex() {
  display: flex;
}

/*-------清除浮动-------*/
@mixin clearFix() {
  *zoom: 1;

  &:before,
  &:after {
    content: "";
    display: table;
  }

  &:after {
    clear: both;
  }
}