Html 使用视口元标记设置内容的最小宽度

我需要将内容的最小宽度设置为480px，以便任何人在屏幕上观看时都可以听到您试图在页面上设置内容的最小宽度，而不是视口本身。也许能帮你

您可能希望做：

@media all and (max-width: 480px) {
    // styles assigned when width is smaller than 480px;

}

类似于此，在该块中，您可以发送宽度为480px或更低的屏幕上内容的样式

---

希望这就是您所寻找的。

您的第二个解决方案实际上是可行的——您可能没有看到的是，在

width=devicewidth

之后有两个逗号，这可能就是为什么它不起作用的原因。我复制了它，没有问题

有时候，新鲜的眼睛可以做到这一切

编辑： 但是，在您的情况下，媒体查询正是您所需要的。

<script>
        //viewport just for screens under/with 480px width other screen widths show the whole page resized
        if(screen.width <= 480) {
            document.getElementById("viewport").setAttribute("content", "width=device-width, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;");} 
        //for devices with more and less/equal than 480px width 
        window.onresize = changeViewport;
            function changeViewport(){
                if(screen.width <= 480) {
                    document.getElementById("viewport").setAttribute("content", "width=device-width, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;");} 
                if(screen.width > 480) {
                    document.getElementById("viewport").setAttribute("content", "");}           
                }
    </script>

//视口仅适用于480px以下/宽度为480px的屏幕，其他屏幕宽度显示已调整大小的整个页面
if（screen.width这是一种仅针对平板电脑和台式机的web响应版本的解决方案

此代码将动态禁用移动版本。在移动上：

<!-- Meta Responsive -->
<meta id="myViewport" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script>
window.onload = function () {
    if(screen.width <= 767) {
        var mvp = document.getElementById('myViewport');
        mvp.setAttribute('content','width=767');
    }
}
</script>
<!-- End of Meta Responsive -->


window.onload=函数（）{
如果（screen.width我尝试了很多代码，并通过重新加载视口获得了一些好的结果……但是，我认为最好的方法是创建一个完全响应的网站（高达320px；）

这是最好的办法：



//视区
函数mobileFriendly（）{
setTimeout（函数（）{
if（/Android | webOS | iPhone | iPad | iPod | BlackBerry/i.test（navigator.userAgent））{
var ww=（document.documentElement.clientWidth


你是想设置页面内容的最小宽度吗？为什么不使用媒体查询？这很简单，只需在
元素上设置
最小宽度即可。相关：在这种情况下，JavaScript的杀伤力太大了。根据我的经验，这种JavaScript对元数据的操作效果很好。
<script>
        //viewport just for screens under/with 480px width other screen widths show the whole page resized
        if(screen.width <= 480) {
            document.getElementById("viewport").setAttribute("content", "width=device-width, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;");} 
        //for devices with more and less/equal than 480px width 
        window.onresize = changeViewport;
            function changeViewport(){
                if(screen.width <= 480) {
                    document.getElementById("viewport").setAttribute("content", "width=device-width, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;");} 
                if(screen.width > 480) {
                    document.getElementById("viewport").setAttribute("content", "");}           
                }
    </script>

<!-- Meta Responsive -->
<meta id="myViewport" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script>
window.onload = function () {
    if(screen.width <= 767) {
        var mvp = document.getElementById('myViewport');
        mvp.setAttribute('content','width=767');
    }
}
</script>
<!-- End of Meta Responsive -->