移动端的1px兼容

最新推荐文章于 2021-07-16 16:00:05 发布

xiaocuizao

最新推荐文章于 2021-07-16 16:00:05 发布

阅读量120

点赞数

本文链接：https://blog.csdn.net/xiaocuizao/article/details/99848583

版权

在移动端1px无法转成rem，所以我们经常封装函数，做兼容

推荐博客：https://www.cnblogs.com/katydids/p/9948546.html

他的用法很特别，将上面的博客封装的函数，引入到自己静态资源目录assets下的自定义的主题thene文件夹下定义一个border.js样式文件，

下面是一个例子，我在footer组件内引用这个样式文件

正常的组件是  const FootContainer = atyled.footer`

	样式
`

改成下面的

const FootContainer=border({
    component:styled.footer`
    height:0.6rem;
    ul{
        display:flex;
        justify-content:space-around;
        padding:0;
        margin:0;
        height:0.6rem;

        li{
            list-style:none;
            display:flex;
            flex-direction:column;   
            i{
                margin:0.1rem 0 0.1rem 0;
            }   
        }
    }
`

这里面是对象，可以修改默认样式
})