Html 在响应网站中禁用移动用户的横向定位

我有一个网站，这是响应（有一个单独的媒体查询手机）。它在纵向上看起来很棒，但在横向上却一团糟，所以我们希望在修复它之前禁用移动设备（至少是Android和iOS）的横向。我试着用vieport meta标记来实现这一点，但除了显示正确的缩放，不允许用户缩放，但仍然允许改变方向之外，它并没有太大作用

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

---

我怎样才能达到这样的效果呢？

我能想到的唯一解决办法是根据

窗口旋转你的身体或包裹物。方向

$(window).bind("orientationchange", function(){
    var orientation = window.orientation;
    var new_orientation = (orientation) ? 0 : 180 + orientation;
    $('body').css({
        "-webkit-transform": "rotate(" + new_orientation + "deg)"
    });
});

这是一种冒险的方式，但认为这是唯一的方式

或者，您可以绑定到窗口调整大小事件

$(window).bind("resize", function()