体验新版 GitCode,发现更多精彩内容 >>
webpackJsonp([12],{"eaw/":function(s,t,a){var r=a("VU/8")(null,a("flel"),null,null,null);s.exports=r.exports},flel:function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"style模块"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-style模块-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" style 模块")]),s._v(" "),a("p",[s._v("style 模块主要包含就是样式部分,包含基础的 reset、基础通用样式以及内置 icon。")]),s._v(" "),a("h3",{attrs:{id:"reset.css"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-reset.css-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" reset.css")]),s._v(" "),s._m(0),s._v(" "),s._m(1),s._v(" "),a("h3",{attrs:{id:"base.css"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-base.css-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" base.css")]),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),a("h3",{attrs:{id:"内置icon"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-内置icon-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 内置 icon")]),s._v(" "),s._m(4),s._v(" "),a("p",[s._v("内置 icon 有 13 个:")]),s._v(" "),s._m(5),s._v(" "),s._m(6)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("源码地址:"),a("a",{attrs:{href:"https://github.com/didi/cube-ui/blob/master/src/common/stylus/reset.styl"}},[s._v("reset")]),s._v(",使用的就是 Eric Meyer's Reset CSS。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-stylus"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("/**\n * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)\n * http://cssreset.com\n */")]),s._v("\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("html")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("body")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("div")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("span")]),s._v(", applet, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("object")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("iframe")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("h1")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("h2")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("h3")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("h4")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("h5")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("h6")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("p")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("blockquote")]),s._v(", pre,\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("a")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("abbr")]),s._v(", acronym, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("address")]),s._v(", big, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("cite")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("code")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("del")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("dfn")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("em")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("img")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("ins")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("kbd")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("q")]),s._v(", s, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("samp")]),s._v(",\nsmall, strike, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("strong")]),s._v(", sub, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("sup")]),s._v(", tt, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("var")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("b")]),s._v(", u, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("i")]),s._v(", center,\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("dl")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("dt")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("dd")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("ol")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("ul")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("li")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("fieldset")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("form")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("label")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("legend")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("table")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("caption")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("tbody")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("tfoot")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("thead")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("tr")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("th")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("td")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("article")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("aside")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("canvas")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("details")]),s._v(", embed,\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("figure")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("figcaption")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("footer")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("header")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("menu")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("nav")]),s._v(", output, ruby, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("section")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("summary")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("time")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("mark")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("audio")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("video")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("input")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("margin")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("padding")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("font-size")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("100%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("font-weight")]),s._v(": normal\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("vertical-align")]),s._v(": baseline\n\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("/* HTML5 display-role reset for older browsers */")]),s._v("\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("article")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("aside")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("details")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("figcaption")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("figure")]),s._v(",\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("footer")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("header")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("menu")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("nav")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("section")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("display")]),s._v(": block\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("body")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("line-height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("blockquote")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("q")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("quotes")]),s._v(": none\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("blockquote")]),s._v(":before, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("blockquote")]),s._v(":after,\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("q")]),s._v(":before, "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("q")]),s._v(":after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("content")]),s._v(": none\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("table")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-collapse")]),s._v(": collapse\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-spacing")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("/* custom */")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("a")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("#7e8c8d")]),s._v("\n -webkit-"),a("span",{attrs:{class:"hljs-attribute"}},[s._v("backface-visibility")]),s._v(": hidden\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("text-decoration")]),s._v(": none\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("li")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("list-style")]),s._v(": none\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("body")]),s._v("\n -webkit-text-size-adjust: "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("none")]),s._v("\n -webkit-tap-highlight-"),a("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(": rgba("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("源码地址:"),a("a",{attrs:{href:"https://github.com/didi/cube-ui/blob/master/src/common/stylus/base.styl"}},[s._v("base")]),s._v(",主要包含的就是 "),a("code",{pre:!0},[s._v("html")]),s._v(", "),a("code",{pre:!0},[s._v("body")]),s._v(" 元素的 "),a("code",{pre:!0},[s._v("font-family")]),s._v(", "),a("code",{pre:!0},[s._v("line-height")]),s._v(" 等的设定,修正浮动影响的 "),a("code",{pre:!0},[s._v(".clear-fix")]),s._v(",以及上下左右四个边框的绝对 1px 边框的 class:"),a("code",{pre:!0},[s._v(".border-top-1px")]),s._v(", "),a("code",{pre:!0},[s._v(".border-right-1px")]),s._v(", "),a("code",{pre:!0},[s._v(".border-bottom-1px")]),s._v(", "),a("code",{pre:!0},[s._v(".border-left-1px")]),s._v("。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-stylus"}},[s._v("@require "),a("span",{attrs:{class:"hljs-string"}},[s._v('"./variable.styl"')]),s._v("\n\n"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("body")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("html")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("line-height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("font-family")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'PingFang SC'")]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v("'STHeitiSC-Light'")]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Helvetica-Light'")]),s._v(", arial, sans-serif, "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Droid Sans Fallback'")]),s._v("\n user-select: "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("none")]),s._v("\n -webkit-tap-highlight-"),a("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(": transparent\n\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".clear-fix")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("content")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('""')]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("display")]),s._v(": table\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("clear")]),s._v(": both\n\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-top-1px")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-right-1px")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-bottom-1px")]),s._v(", "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-left-1px")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("position")]),s._v(": relative\n &::before, &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("content")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('""')]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("display")]),s._v(": block\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("position")]),s._v(": absolute\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform-origin")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-top-1px")]),s._v("\n &::before\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-top")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1px")]),s._v(" solid "),a("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("left")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("top")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("width")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("100%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform-origin")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" top\n\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-right-1px")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-right")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1px")]),s._v(" solid "),a("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-col-line\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("top")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("right")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("100%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform-origin")]),s._v(": right "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-bottom-1px")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-bottom")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1px")]),s._v(" solid "),a("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("left")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("bottom")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("width")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("100%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform-origin")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" bottom\n\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-left-1px")]),s._v("\n &::before\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-left")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1px")]),s._v(" solid "),a("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-col-line\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("top")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("left")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("100%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform-origin")]),s._v(": left "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n\n@media (min-resolution: "),a("span",{attrs:{class:"hljs-number"}},[s._v("2dppx")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-top-1px")]),s._v("\n &::before\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("width")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("200%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("5")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-right-1px")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("200%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("5")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-bottom-1px")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("width")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("200%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("5")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-left-1px")]),s._v("\n &::before\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("200%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("5")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n\n@media (min-resolution: "),a("span",{attrs:{class:"hljs-number"}},[s._v("3dppx")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-top-1px")]),s._v("\n &::before\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("width")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("300%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("333")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-right-1px")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("300%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("333")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-bottom-1px")]),s._v("\n &::after\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("width")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("300%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("333")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n "),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".border-left-1px")]),s._v("\n &::before\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("300%")]),s._v("\n "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("transform")]),s._v(": scale(."),a("span",{attrs:{class:"hljs-number"}},[s._v("333")]),s._v(") translateZ("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(")\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("图标是利用 "),a("a",{attrs:{href:"https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face"}},[s._v("font-face")]),s._v(" 规则自定义字体 "),a("code",{pre:!0},[s._v('"cube-icon"')]),s._v(" 实现的。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("img",{attrs:{src:"https://raw.githubusercontent.com/didi/cube-ui/master/assets/icon.png",alt:"cube icons"}})])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("使用的时候只需要加入对应的类名即可,例如 alert 图标,可以这样用:"),a("code",{pre:!0},[s._v('<i class="cubeic-alert"></i>')]),s._v("。")])}]}},rDWR:function(s,t,a){s.exports=a("eaw/")}});