/* 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中,还原当前字体文件
/*
* 基础组件技术总结
*/
css3播放器,css 关键技巧,css scale啥意思,css控制字符隐藏,css排行榜头像,怎么用css设置边框运动,css分块代码