业务线B/C端业务组件总结

/**

* 业务线组件总结

* */

/* B端组件的总结

1、组件cssBase的总结

1像素底部边框 */

@mixin border - 1px - b($background: $gray - lightest) {

content: '';

display: block;

width: 200 %;

height: 1px;

background: $background;

-webkit - transform: scale(0.5);

transform: scale(0.5);

-webkit - transform - origin: 0 1px;

transform - origin: 0 1px; // 属性允许您改变被转换元素的位置 x,y,z

position: absolute;

left: 0;

bottom: 0;

z - index: 10;

}

/*

*css_base_cssBase &_扩展

*/

.css_base {

&_cssBase {

box - shadow: h - shadow v - shadow blur spread color inset; // 水平阴影的位置 垂直阴影的位置 模糊距离 阴影的尺寸 阴影的颜色

position: relative;

@include border - 1px - b();

}

}

/*

* cssThemeB

* @desc 主题包括{bg,color,font-size}

* 学习要点----为了方便字体的扩展，封装成单独的对象

*/

let themeConfig= {

bg: [ {

class: 'bg-toast',

name: '遮罩层背景色'

}

],

color:[ {

class: 'color-title',

name: '主标题色'

}

],

font-color:[ {

class: 'font-sz',

name: '主标题色'

}

]

}

/*

* cssIconB 图标进行转化字体方式引用---base64---可以转化、支持多种格式

*/

# iconfonts

本文件夹用来处理图标字体相关，

## svg转字体库

使用icommon网站，进行图标转化

网址：https://icomoon.io

转出的字体库包括eot、svg、ttf、woff、json文件

## 字体库使用

字体库使用dataUrl的形式嵌入到iconfonts.css中。

字体文件转base64网址（https://www.motobit.com/util/base64-decoder-encoder.asp）

## 字体库更新

文件夹中包含selection.json文件，可以放入icomoon中，还原当前字体文件

/*

* 基础组件技术总结

*/