html:
<text class="icon-check">text>
css:
- .icon-check {
- border: 2px solid black;
- border-left: 0;
- border-top: 0;
- height: 12px;
- width: 6px;
- transform-origin: center;
- transform: rotate(45deg);
- }
实际上就是声明一个带边框的div 将其中相邻的两边去掉再通过设置两边的边长差来改变夹角,比较适合用来显示对钩符号。
因为uni-app的page-meta再加上插件postcss-px-to-viewport插件可以将页面中的px/rpx进行大小动态设置,此处的px就可以随着全局变量中的字体大小一起进行变化,当想设计一个大小不随着全局变量变化的符号时将其换成rpx即可(postcss-px-to-viewport配置文件中可以生命将px进行转换还是将rpx进行转换)。