网页显示问题1920px如何缩放啊 45C

我的网页宽度设置为1920px,浏览器打开时是被拉宽的效果,在不缩放浏览器网页本身的基础上想要网页内容居中显示,左右留有旁白?
在网上也查看了一些方法都没用,如何从代码中解决问题,让它适应不同浏览器,大神们支支招

23个回答

用百分比呀你设置固定值肯定是没法自适应的

lllll520520520520520
lllll520520520520520 回复qq_38899875: 怎么可能有1920px呢?我的电脑屏幕才1366px.
接近 2 年之前 回复
qq_38899875
qq_38899875 如何使用百分比,小白不知道,要求是1920px
接近 2 年之前 回复

宽度按百分比,设置最大值,或者干脆写几个样式,比如 1100居中---普通电脑 900----平板 500 -- 小号平板 然后就会手机版了

宽度设置百分比,根据媒体查询设置不同的样式

lllll520520520520520
lllll520520520520520 回复lllll520520520520520: 错了,是style=“width:50%;”
接近 2 年之前 回复
lllll520520520520520
lllll520520520520520 回复qq_38899875: 比如style="width=50%;"就是写个百分数,不要写具体的数字。你先写成50%看看,不行再换别的百分数
接近 2 年之前 回复
qq_38899875
qq_38899875 能不能详细点,还是不会
接近 2 年之前 回复

用rem 倒替px,1rem=12.5px,你自己换算一下

lllll520520520520520
lllll520520520520520 回复qq_38899875: 这个我就不知道了
接近 2 年之前 回复
qq_38899875
qq_38899875 换算后页面还是被拉宽的效果,只是旁白变大了,
接近 2 年之前 回复
lllll520520520520520
lllll520520520520520 用rem 代替px,1rem=12.5px,你自己换算一下
接近 2 年之前 回复

比如说这样


<style>
    body,html{margin: 0;padding: 0}
    .container{
        width: 80%;
        margin:0 auto;
    }
    .clear{
        clear: both;
    }
    .nav{
        float: left;
        width: 24%;
        height: 50px;
        border: 1px solid #b5b5b5;
        text-align: center;
        line-height: 50px;
        background: #cbcdcc;
    }  

    /* 当显示宽度<1920px时 居中容器的宽度是浏览器的70%*/
    @media screen and (max-width:1920px){
        .container{
            width: 70%;
        }
    }
    /* 当显示宽度<1200px时 居中容器的宽度是浏览器的50%*/
    @media screen and (max-width:1200px){
        .container{
            width: 50%;
        }
    }


</style>
<body>
<div class="container">
<div class="div1 nav">首页</div>
<div class="div2 nav">选项1</div>
<div class="div3 nav">选项2</div>
<div class="div4 nav">选项3</div>
<div class="clear"></div>
</div>
</body>

具体用法可参考@media 用法实例, 很多的前端框架都是用@media和宽度百分比来做到自适应的

qq_39917971
WJ_F 回复qq_38899875: 给最外面的div加上margin:0 auto;
接近 2 年之前 回复
qq_38899875
qq_38899875 左边旁白出来了,页面还是被拉宽的,右边没有旁白,怎么办?
接近 2 年之前 回复

强制使用百分比,或者你用ps给图片修改一下,再不然就是写一个程序让网页根据用户的浏览器大小自动缩放。

qq_38899875
qq_38899875 大神能不能把这个程序分享出来?我不会写
接近 2 年之前 回复

1,设置百分比显示,这个最简单,(不过感觉应该是设置了百分比被拉伸了)
2,动态获取屏幕大小,然后计算位置和大小,设置图片的属性在显示

qq_38899875
qq_38899875 如果我设置最外层网页百分比的话,页面会向右边移动,还是被拉宽的,左边的旁白可以出来,右边是没有旁白的
接近 2 年之前 回复

先获取网页的宽度,然后按照比例将所有元素都按照等比例计算。

qq_38899875
qq_38899875 大神能不能分享一段代码?
接近 2 年之前 回复

div套div,小的div宽度设置小一点,居中

百分比或者编写多个布局

qq_38899875
qq_38899875 百分比我用过了,可能是我没用好,就是没有丝毫作用,怎么办
接近 2 年之前 回复
共23条数据 1 3 尾页
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!