/*
1. reset 的目的不是清除浏览器的默认样式，这仅是部分工作。清除和重置是紧密不可分的。
2. reset 的目的不是让默认样式在所有浏览器下一致，而是减少默认样式有可能带来的问题。
3. reset 期望提供一套普适通用的基础样式。但没有银弹，推荐根据具体需求，裁剪和修改后再使用。
 */


/**********************  清除内外边距  ***********************/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */ {
  margin: 0;
  padding: 0;
}


/**********************  设置默认字体  ***********************/
body, input, select, textarea /* for ie */ {
  font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif;
}
h1, h2, h3, h4, h5, h6 { 
    font-size: 100%; 
}
/* 将斜体扶正 */
address, cite, dfn, em, var { 
    font-style: normal; 
} 
/* 统一等宽字体 */
code, kbd, pre, samp { 
    font-family: courier new, courier, monospace; 
}
/* 小于 12px 的中文很难阅读，让 small 正常化 */
small { 
    font-size: 12px; 
}


/**********************  重置列表元素  ***********************/
ul, ol { 
    list-style: none; 
}


/**********************  重置文本格式元素  ***********************/
a { 
    text-decoration: none; 
}
a:hover { 
    text-decoration: underline; 
}


/**********************  重置表单元素  ***********************/
/* for ie6 */
legend { 
    color: #000; 
}
/* img 搭车：让链接里的 img 无边框 */
fieldset, img { 
    border: 0; 
}
/* 使得表单元素在 ie 下能继承字体大小 */
button, input, select, textarea { 
    font-size: 100%; 
}


/**********************  重置表格元素  ***********************/
table { 
    border-collapse: collapse;
    border-spacing: 0; 
}



/**********************  center, middle  ***********************/
.center-m {
    margin: 0 auto;
}
.center-p {
    position: absolute;
    left: 50%;
    margin-left: -25%;
}
.center-pt {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.middle-position  {
    position: absolute;
    top: 50%;
    margin-top: -25%;
}
/**********************  center, middle  ***********************/


/**********************  display  ***********************/
.flex {
    display: flex;
}
.column {
    display: flex;
    flex-flow: column;
}
.around {
    justify-content: space-around;
}
.between {
    justify-content: space-between;
}
.center {
    justify-content: center;
}
/**********************  display  ***********************/

/**********************  float  ***********************/
.f-left {
    float: left;
}
.f-right {
    float: right;
}
.clear {
    zoom: 1;
}
.clear:after {
    content: "";
    display: block; 
    clear: both;
    height: 0; 
    visibility: hidden;
}
/**********************  float  ***********************/


/**********************  info  ***********************/
.waring {
    color: #E6A23C;
}
.bg-warning {
    color: #fff;
    background-color: #E6A23C;
}
.success {
    color: #67C23A;
}
.bg-success {
    color: #fff;
    background-color: #67C23A;
}
.primary {
    color: #409EFF;
}
.bg-primary {
    color: #fff;
    background-color: #409EFF;
}
.info {
    color: #909399;
}
.bg-info {
    color: #fff;
    background-color: #909399;
}
.danger {
    color: #F56C6C;
}
.bg-danger {
    color: #fff;
    background-color: #F56C6C;
}
/**********************  info  ***********************/


/**********************  form  ***********************/
.disabled {
    filter: grayscale(1);
}
.t-left {
    text-align: left;
}
.t-center {
    text-align: center;
}
.t-right {
    text-align: right;
}
/**********************  form  ***********************/


/**********************  table  ***********************/

/**********************  table  ***********************/