wag-styl v0.1.0

文档

• common.css
• align.css
• box.css
• btn.css
• color.css
• column.css
• display.css
• float.css
• fontSize.css
• lineHeight.css
• link.css
• newline.css
• svg.css
• reset.css

返回目录

包含所有样式（除reset.css）

返回目录

.wag-text-l {
  text-align: left
}

.wag-text-r {
  text-align: right
}

.wag-text-c {
  text-align: center
}

返回目录

.wag-mg-t4 {
  margin-top: 4px
}

.wag-mg-t8 {
  margin-top: 8px
}

.wag-mg-t12 {
  margin-top: 12px
}

.wag-mg-t16 {
  margin-top: 16px
}

.wag-mg-t20 {
  margin-top: 20px
}

.wag-mg-t24 {
  margin-top: 24px
}

.wag-mg-t28 {
  margin-top: 28px
}

.wag-mg-t32 {
  margin-top: 32px
}

.wag-mg-t36 {
  margin-top: 36px
}

.wag-mg-t40 {
  margin-top: 40px
}

.wag-mg-r4 {
  margin-right: 4px
}

.wag-mg-r8 {
  margin-right: 8px
}

.wag-mg-r12 {
  margin-right: 12px
}

.wag-mg-r16 {
  margin-right: 16px
}

.wag-mg-r20 {
  margin-right: 20px
}

.wag-mg-r24 {
  margin-right: 24px
}

.wag-mg-r28 {
  margin-right: 28px
}

.wag-mg-r32 {
  margin-right: 32px
}

.wag-mg-r36 {
  margin-right: 36px
}

.wag-mg-r40 {
  margin-right: 40px
}

.wag-mg-b4 {
  margin-bottom: 4px
}

.wag-mg-b8 {
  margin-bottom: 8px
}

.wag-mg-b12 {
  margin-bottom: 12px
}

.wag-mg-b16 {
  margin-bottom: 16px
}

.wag-mg-b20 {
  margin-bottom: 20px
}

.wag-mg-b24 {
  margin-bottom: 24px
}

.wag-mg-b28 {
  margin-bottom: 28px
}

.wag-mg-b32 {
  margin-bottom: 32px
}

.wag-mg-b36 {
  margin-bottom: 36px
}

.wag-mg-b40 {
  margin-bottom: 40px
}

.wag-mg-l4 {
  margin-left: 4px
}

.wag-mg-l8 {
  margin-left: 8px
}

.wag-mg-l12 {
  margin-left: 12px
}

.wag-mg-l16 {
  margin-left: 16px
}

.wag-mg-l20 {
  margin-left: 20px
}

.wag-mg-l24 {
  margin-left: 24px
}

.wag-mg-l28 {
  margin-left: 28px
}

.wag-mg-l32 {
  margin-left: 32px
}

.wag-mg-l36 {
  margin-left: 36px
}

.wag-mg-l40 {
  margin-left: 40px
}

.wag-pd-t4 {
  padding-top: 4px
}

.wag-pd-t8 {
  padding-top: 8px
}

.wag-pd-t12 {
  padding-top: 12px
}

.wag-pd-t16 {
  padding-top: 16px
}

.wag-pd-t20 {
  padding-top: 20px
}

.wag-pd-t24 {
  padding-top: 24px
}

.wag-pd-t28 {
  padding-top: 28px
}

.wag-pd-t32 {
  padding-top: 32px
}

.wag-pd-t36 {
  padding-top: 36px
}

.wag-pd-t40 {
  padding-top: 40px
}

.wag-pd-r4 {
  padding-right: 4px
}

.wag-pd-r8 {
  padding-right: 8px
}

.wag-pd-r12 {
  padding-right: 12px
}

.wag-pd-r16 {
  padding-right: 16px
}

.wag-pd-r20 {
  padding-right: 20px
}

.wag-pd-r24 {
  padding-right: 24px
}

.wag-pd-r28 {
  padding-right: 28px
}

.wag-pd-r32 {
  padding-right: 32px
}

.wag-pd-r36 {
  padding-right: 36px
}

.wag-pd-r40 {
  padding-right: 40px
}

.wag-pd-b4 {
  padding-bottom: 4px
}

.wag-pd-b8 {
  padding-bottom: 8px
}

.wag-pd-b12 {
  padding-bottom: 12px
}

.wag-pd-b16 {
  padding-bottom: 16px
}

.wag-pd-b20 {
  padding-bottom: 20px
}

.wag-pd-b24 {
  padding-bottom: 24px
}

.wag-pd-b28 {
  padding-bottom: 28px
}

.wag-pd-b32 {
  padding-bottom: 32px
}

.wag-pd-b36 {
  padding-bottom: 36px
}

.wag-pd-b40 {
  padding-bottom: 40px
}

.wag-pd-l4 {
  padding-left: 4px
}

.wag-pd-l8 {
  padding-left: 8px
}

.wag-pd-l12 {
  padding-left: 12px
}

.wag-pd-l16 {
  padding-left: 16px
}

.wag-pd-l20 {
  padding-left: 20px
}

.wag-pd-l24 {
  padding-left: 24px
}

.wag-pd-l28 {
  padding-left: 28px
}

.wag-pd-l32 {
  padding-left: 32px
}

.wag-pd-l36 {
  padding-left: 36px
}

.wag-pd-l40 {
  padding-left: 40px
}

返回目录

.wag-btn {
  display: inline-block;
  margin-bottom: 0;
  box-sizing: content-box;
  padding: 6px 18px;
  outline: none;
  height: 18px;
  line-height: 18px;
  font-weight: 400;
  text-align: center;
  font-size: 12px;
  vertical-align: top;
}
.wag-btn-major {
  color: #fff;
  border: 1px #316ccb solid;
  background: #316ccb;
}
.wag-btn-major:hover {
  border: 1px #407fe7 solid;
  background: #407fe7;
  cursor: pointer;
}
.wag-btn-minor {
  border: 1px #316ccb solid;
  background: #fff;
  color: #316ccb;
}
.wag-btn-minor:hover {
  border: 1px #316ccb solid;
  background: #316ccb;
  color: #fff;
  cursor: pointer;
}
.wag-btn-disabled {
  border: 1px #f5f5f5 solid;
  background: #f5f5f5;
  color: #c5c5c5;
}
.wag-btn-disabled:hover {
  border: 1px #f5f5f5 solid;
  background: #f5f5f5;
  cursor: not-allowed;
}
.wag-btn-small {
  padding: 2px 12px;
}
.wag-btn-large {
  padding: 10px 24px;
  font-size: 14px;
}

返回目录

.wag-black {
    color: #656565
}

.wag-black-light {
  color: #959595
}

.wag-black-dark {
  color: #353535
}

.wag-black-lightest {
  color: #c5c5c5
}

.wag-white {
  color: #fff
}

.wag-blue {
  color: #316ccb
}

.wag-orange {
  color: #ff7300
}

.wag-red {
  color: #de3331
}

.wag-yellow {
  color: #f5a623
}

返回目录

.wag-lay-col {
  margin-left: -16px;
  width: 1200px
}

.wag-lay-col:after {
  display: block;
  clear: both;
  width: 0;
  height: 0;
  content: "\0020"
}

.wag-lay-col .wag-col-1 {
  float: left;
  margin-left: 16px;
  width: 34px
}

.wag-lay-col .wag-col-2 {
  float: left;
  margin-left: 16px;
  width: 84px
}

.wag-lay-col .wag-col-3 {
  float: left;
  margin-left: 16px;
  width: 134px
}

.wag-lay-col .wag-col-4 {
  float: left;
  margin-left: 16px;
  width: 184px
}

.wag-lay-col .wag-col-5 {
  float: left;
  margin-left: 16px;
  width: 234px
}

.wag-lay-col .wag-col-6 {
  float: left;
  margin-left: 16px;
  width: 284px
}

.wag-lay-col .wag-col-7 {
  float: left;
  margin-left: 16px;
  width: 334px
}

.wag-lay-col .wag-col-8 {
  float: left;
  margin-left: 16px;
  width: 384px
}

.wag-lay-col .wag-col-9 {
  float: left;
  margin-left: 16px;
  width: 434px
}

.wag-lay-col .wag-col-10 {
  float: left;
  margin-left: 16px;
  width: 484px
}

.wag-lay-col .wag-col-11 {
  float: left;
  margin-left: 16px;
  width: 534px
}

.wag-lay-col .wag-col-12 {
  float: left;
  margin-left: 16px;
  width: 584px
}

.wag-lay-col .wag-col-13 {
  float: left;
  margin-left: 16px;
  width: 634px
}

.wag-lay-col .wag-col-14 {
  float: left;
  margin-left: 16px;
  width: 684px
}

.wag-lay-col .wag-col-15 {
  float: left;
  margin-left: 16px;
  width: 734px
}

.wag-lay-col .wag-col-16 {
  float: left;
  margin-left: 16px;
  width: 784px
}

.wag-lay-col .wag-col-17 {
  float: left;
  margin-left: 16px;
  width: 834px
}

.wag-lay-col .wag-col-18 {
  float: left;
  margin-left: 16px;
  width: 884px
}

.wag-lay-col .wag-col-19 {
  float: left;
  margin-left: 16px;
  width: 934px
}

.wag-lay-col .wag-col-20 {
  float: left;
  margin-left: 16px;
  width: 984px
}

.wag-lay-col .wag-col-21 {
  float: left;
  margin-left: 16px;
  width: 1034px
}

.wag-lay-col .wag-col-22 {
  float: left;
  margin-left: 16px;
  width: 1084px
}

.wag-lay-col .wag-col-23 {
  float: left;
  margin-left: 16px;
  width: 1134px
}

.wag-lay-col .wag-col-eq-2 {
  float: left;
  margin-left: 16px;
  width: 584px
}

.wag-lay-col .wag-col-eq-3 {
  float: left;
  margin-left: 16px;
  width: 384px
}

.wag-lay-col .wag-col-eq-4 {
  float: left;
  margin-left: 16px;
  width: 284px
}

.wag-lay-col .wag-col-eq-5 {
  float: left;
  margin-left: 16px;
  width: 224px
}

.wag-lay-col .wag-col-eq-6 {
  float: left;
  margin-left: 16px;
  width: 184px
}

返回目录

.wag-inline {
  display: inline
}

.wag-block,.wag-show {
  display: block
}

.wag-hide {
  display: none
}

.wag-i-block {
  display: inline-block
}

返回目录

.wag-fl{
  float:left
}
.wag-fr{
  float:right
}
.wag-clear:after{
  display:block;
  clear:both;
  width:0;
  height:0;
  content:"\0020"
}

返回目录

.wag-fs-12 {
  font-size: 12px
}

.wag-fs-14 {
  font-size: 14px
}

.wag-fs-16 {
  font-size: 16px
}

.wag-fs-18 {
  font-size: 18px
}

.wag-fs-20 {
  font-size: 20px
}

.wag-fs-24 {
  font-size: 24px
}

.wag-fs-28 {
  font-size: 28px
}

.wag-fs-32 {
  font-size: 32px
}

.wag-fs-40 {
  font-size: 40px
}

.wag-fs-48 {
  font-size: 48px
}

.wag-fs-64 {
  font-size: 64px
}

返回目录

.wag-lh-20 {
  line-height: 20px
}

.wag-lh-24 {
  line-height: 24px
}

.wag-lh-28 {
  line-height: 28px
}

.wag-lh-32 {
  line-height: 32px
}

.wag-lh-36 {
  line-height: 36px
}

.wag-lh-48 {
  line-height: 48px
}

.wag-lh-60 {
  line-height: 60px
}

返回目录

.wag-link-black,
.wag-link-black:link,
.wag-link-black:visited{color:#656565}
.wag-link-black:active,
.wag-link-black:hover,
.wag-link-blue,
.wag-link-blue:link,
.wag-link-blue:visited {
  color:#316ccb
}
.wag-link-blue:active,
.wag-link-blue:hover {
  color:#407fe7
}

返回目录

.wag-ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden
}

.wag-break-all {
  word-wrap: break-word;
  word-break: break-all
}

返回目录

.wag-svg-icon {
  width: 1em;
  height: 1em;
  vertical-align: -.15em;
  fill: currentColor;
  overflow: hidden
}

返回目录

html {
  min-width: 1184px;
  color: #656565;
  overflow-y: scroll;
  background: #fff;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%
}

blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul {
  margin: 0;
  padding: 0
}

body,button,input,select,textarea {
  font: 12px/1.5 -apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Roboto,Arial,Microsoft YaHei,"sans-serif"
}

h1,h2,h3,h4,h5,h6 {
  font-size: 100%;
  font-weight: 400
}

address,cite,dfn,em,var {
  font-style: normal
}

code,kbd,pre,samp,tt {
  font-family: monospace
}

small {
  font-size: 12px
}

ol,ul {
  list-style: none
}

a {
  background-color: transparent;
  text-decoration: none
}

a:active,a:hover {
  outline: 0
}

a:hover {
  text-decoration: underline
}

abbr[title],acronym[title] {
  border-bottom: 1px dotted;
  cursor: help
}

q:after,q:before {
  content: ""
}

:focus {
  outline: 0
}

legend {
  color: #353535
}

fieldset,img {
  border: none
}

button,input,select,textarea {
  font-size: 100%
}

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

hr {
  border: none;
  height: 1px
}

b,strong {
  font-weight: 600
}

img {
  -ms-interpolation-mode: bicubic
}

template {
  display: none
}

input::-webkit-input-placeholder {
  color: #959595
}

input:-moz-placeholder,input::-moz-placeholder {
  color: #959595
}

input:-ms-input-placeholder {
  color: #959595
}

input::-ms-clear,input::-ms-reveal,input::-webkit-search-cancel-button {
  display: none
}