PIXPRO主题:移动端CSS优化

123
1
文章

/* evan.plus - WordPress 额外 CSS 手机端临时补丁 v2 */
@media (max-width: 768px){
  /* 1) 全局防横向溢出 */
  html,body,.app-container,.main-warp{max-width:100%;overflow-x:hidden}
  .center-content.center-half,
  .site-main,
  .single-content,
  .home-blog-content,
  .home-moment-content,
  .content_comments{max-width:100%;min-width:0}
  /* 2) 全站两栏 -> 单栏,侧栏统一隐藏(首页 / 详情 / Talk 等) */
  .home-classic .uk-grid{margin-left:0}
  .home-classic .uk-grid > *{padding-left:0}
  .right.right-widget,
  .right.left-widget{display:none!important}
  /* 3) 头部压缩:菜单只留图标,做成更紧凑的圆角按钮 */
	.left{display:none}
	.logo-area{display:none}
  body.classic .site{margin-top:0}
  .classic-header{height:auto}
  .classic-header-bg{border-radius:0}
  .classic-header-bg .header-bg-inner{
    flex-wrap:nowrap;
    align-items:center;
    padding:10px 12px;
    gap:10px;
  }
  .classic-header .center-area{flex:1;min-width:0;width:auto;order:initial}
  .classic-nav{width:100%;height:auto;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .classic-nav ul{
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    gap:8px;
    height:auto;
    margin:0;
    padding:0;
    white-space:nowrap;
  }
  .classic-nav ul li{flex:none}
  .classic-nav ul li a{
    padding:0;
    min-width:auto;
    border-radius:999px;
    background:none;
  }
  .classic-nav .nav-link-item{
    width:30px;
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#f6f7fb;
  }
  .classic-nav .nav_title{display:none!important}
  .classic-nav .nav-link-item i{
    margin:0!important;
    font-size:18px;
    line-height:1;
  }
  .classic-nav li.current-menu-item .nav-link-item,
  .classic-nav li.current_page_item .nav-link-item,
  .classic-nav li.active-nav .nav-link-item{
    background:#1f39ff;
    color:#fff;
  }
  .classic-nav,.posts_cat_nav ul{scrollbar-width:none}
  .classic-nav::-webkit-scrollbar,.posts_cat_nav ul::-webkit-scrollbar{display:none}
  /* 4) 分类条、分页等横向区域缩紧 */
  .posts_cat_nav{padding:16px}
  .posts_cat_nav ul{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}
  .posts_cat_nav ul li{flex:none}
  .pagenav-box{margin:20px 16px;height:auto;gap:12px;flex-wrap:wrap}
	
  /* 5) 尾部 4 个广告位隐藏 */
  .footer-widget-area{display:none}
  /* 6) 详情页 / 圈子页常见手机兜底 */
  .single-content,
  .post-content,
  .mos-content,
  .ppo-rich-text-content,
  .entry-content{overflow-wrap:anywhere}
  .content_comments{display:block}
  /* 7) 媒体 / 表格 / 代码块自适应 */
  img,svg,video,iframe{max-width:100%;height:auto}
  .entry-content pre,.post-content pre,.single-content pre,.ppo-rich-text-content pre,
  .entry-content table,.post-content table,.single-content table,.ppo-rich-text-content table{
    display:block;
    max-width:100%;
    overflow-x:auto;
  }
}

NOTHING

你好,朋友
修改资料

    空空如也!

ad