代码拉取完成，页面将自动刷新
将此文件放入static目录下，并在App.vue的
<style lang="scss"></style>
中引入
@import "static/styles/index.scss";
至此，就可以在项目中使用此样式库中的样式了。
样式库提供了一个类f-x，这个x为1-300之间(包含1和300)。
示例
<view class="f-20"></view>
这个.f-20在样式库的内部样式定义为：
.f-20 {
font-size: 20rpx;
}
.fw-small {
font-weight: 600;
}
.fw-medium {
font-weight: 700;
}
.fw-large {
font-weight: 800;
}
.fw-none {
font-weight: normal;
}
.tal {
text-align: left;
}
.tac {
text-align: center;
}
.tar {
text-align: right;
}
.tie {
text-indent: 2em;
}
样式库定义了一套内外边距的类名，类似p-x、p-l-x等，这里的x取值规则如下：
示例
如果我们想定义60rpx的左外边距：
<view class="m-l-60"></viwe>
这个.m-l-60在样式库的内部样式定义为：
.m-l-60 {
margin-left: 60rpx;
}
以此类推。
如果我们想同时添加左右60rpx的外边距：
<view class="m-x-60"></viwe>
如果我们想同时添加上下60rpx的外边距：
<view class="m-y-60"></viwe>
内边距同理。
样式库尽可能的将flex布局所要用到的样式都列出来，通过组合，可以满足大部分flex布局需求。
示例
<view class="flex-sb"></viwe>
可以让该元素内的子盒子左右贴边并上下居中，我们可以用
<view class="flex-sb flex-aifs"></viwe>
来重置子盒子在交叉轴上的对齐方式（.flex-aifs让子盒子在交叉轴上位于起始位置）。
<view class="flex-vfe"></viwe>
可以让该元素内的子盒子在垂直方向处于结束位置，其中.flex-vfe把主轴改为了垂直方向，我们同样可以用.flex-aifs来重置交叉轴的对齐方式。
更多flex布局样式可以查看flex.scss源码。
样式库定义了一套宽高的类名，类似w-x、h-x等，这里的x取值规则如下：
示例
如果我们想定义426rpx的宽：
<view class="w-426"></viwe>
这个.w-426在样式库的内部样式定义为：
.w-426 {
width: 426rpx;
}
以此类推。
样式库定义了一套宽高百分比的类名，类似w-xp、h-xp等，这里的x取值规则如下：
示例
如果我们想定义66%的高度百分比：
<view class="h-66p"></viwe>
这个.h-66p在样式库的内部样式定义为：
.h-66p {
height: 66%;
}
以此类推。
样式库定义了一套行高的类名，类似lh-x等，这里的x取值规则如下：
示例
如果我们想定义32rpx的高度百分比：
<view class="lh-32"></viwe>
这个.lh-32在样式库的内部样式定义为：
.lh-32 {
line-height: 32rpx;
}
以此类推。
.pos {
position: relative;
}
/* 固定定位 */
.pos-fixed {
position: fixed !important;
}
/* 粘性定位 */
.pos-sticky {
position: sticky !important;
}
定位位置
示例
<view class=".p-ct"></viwe>
这个.p-ct在样式库的内部样式定义为：
.p-ct {
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%);
}
更多定位方式可以查看pos.scss源码。
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。