美文网首页
解决Next主题移动端显示异常

解决Next主题移动端显示异常

作者: 5946a9de5796 | 来源:发表于2018-04-05 11:54 被阅读348次

    解决移动端按钮被遮挡

    移动端显示效果如图,点击按钮之后被挡住,无法关闭菜单


    image
    image

    解决方法

    \next\source\css\_custom\custom.styl中加入

    .site-nav-toggle {
      top: 0;
      transform:  translateY(78%);
    }
    
    image

    按钮已正常显示~

    解决分类、标签等页面tablet设备显示异常

    如图,分类归档标签等页都会出现这种情况


    image

    Next主题中mobile与tablet是通过分辨率区分,实测ipad mini2竖屏是会触发这种显示错误的

    解决方法

    \next\source\css\_schemes\Pisces\_layout.styl中如下位置,添加float: none;

    .content-wrap {
         +tablet() {
              float: none; //这行是后添加进去的
         }
    }
    
    image

    修改后页面已正常显示~

    相关文章

      网友评论

          本文标题:解决Next主题移动端显示异常

          本文链接:https://www.haomeiwen.com/subject/dairhftx.html