Android 移动兼容性CSS

这是我正在开发的网站：

问题是桌面上的一切都显示正确

当涉及平板电脑和手机时，背景会把右角的版权弄得一团糟

当您将手机旋转到

横向时，情况非常糟糕

有人知道我该如何使这款手机兼容并修复其中一些问题吗

编辑：

我注意到，html标记得到了高度：自动添加为样式，这就是底部出现白色条的原因，我如何解决这个问题

EDITx2:我使用我标记的答案和文本滚动条（flexslider问题）修复了高度问题，我使用：

    // Listen for orientation changes
    window.addEventListener("orientationchange", function() {
        // Catch the flexslider context
        var slider = $(".flex_text").data("flexslider");

        // Unset the animating flag so we can move back to the first slide quickly
        slider.animating = false;

        // Move to the first slide and restart the slideshow
        slider.flexAnimate(0);
    }, false);

移除.trans bg中的填充以去除白色条

编辑：
另外，从.banner中删除高度：100%

---

这将完全删除白条

从.trans bg中删除填充以删除白条

编辑： 另外，从.banner中删除高度：100%

这将完全删除白条

从横向媒体查询中删除所有固定高度（高度：350px；），并使用以下样式

@media only screen and (max-width: 650px) and (min-width: 500px){
   html {
       overflow: hidden;
   }
   .trans-bg{
       overflow-y:scroll;
   }
}

您也可以将填充添加到.trans bg。在script.js上更新以下脚本以调用flexslider

$('.flex_text').flexslider({
    animation: "slide",
    selector: ".slides li",
    controlNav: false,
    directionNav: false,
    slideshowSpeed: 4000,
    touch: true,
    useCSS: false,
    direction: "vertical",
    smoothHeight:true
});

Flexslider已经有选项（smoothHeight:true）来设置垂直滚动幻灯片项目的高度，因此无需使用回调函数来设置高度。

从横向媒体查询中删除所有固定高度（高度：350px；），并使用以下样式

@media only screen and (max-width: 650px) and (min-width: 500px){
   html {
       overflow: hidden;
   }
   .trans-bg{
       overflow-y:scroll;
   }
}

您也可以将填充添加到.trans bg。在script.js上更新以下脚本以调用flexslider

$('.flex_text').flexslider({
    animation: "slide",
    selector: ".slides li",
    controlNav: false,
    directionNav: false,
    slideshowSpeed: 4000,
    touch: true,
    useCSS: false,
    direction: "vertical",
    smoothHeight:true
});

---

Flexslider已经有选项（smoothHeight:true）来设置垂直滚动幻灯片项目的高度，因此无需使用回调函数来设置高度。

set.flex_text li{min height:80px}在css中并给出try@ChandraShekhar那没有解决任何问题。我对滚动文本没有问题，我对页面底部的一个白色条有问题，在css中添加了addset.flex_text li{min height:80px}并给出一个try@ChandraShekhar那没有解决任何问题。我对滚动文本没有问题，我对页面底部添加白色条有问题。从横幅移动高度使白色条再次出现。除了手机上的“风景”视图外，其他功能都可以正常工作。这就是白条被添加的地方。似乎是版权在推动它。尝试从“%”切换到“px”

bottom:-25px打开。版权t从横幅移动高度使白色条再次出现。除了手机上的“风景”视图外，其他功能都可以正常工作。这就是白条被添加的地方。似乎是版权在推动它。尝试从“%”切换到“px”
bottom:-25px打开。版权非常感谢！我遇到的另一个问题是，当我从横向旋转到纵向时，flex文本会弄乱（单词位于其他单词之上）。你知道如何解决这个问题吗？你需要在窗口调整大小或方向更改SmoothHeight无效时重置js插件。我编辑了关于什么有效的问题。非常感谢您提及方向更改。非常感谢！我遇到的另一个问题是，当我从横向旋转到纵向时，flex文本会弄乱（单词位于其他单词之上）。你知道如何解决这个问题吗？你需要在窗口调整大小或方向更改SmoothHeight无效时重置js插件。我编辑了关于什么有效的问题。非常感谢您提及方向更改。