缩放页面不影响布局方法

缩放页面不影响布局1、类似百度布局（1）布局时在最外面套一层div，然后给这个div赋一个固定的长宽就可以了。<body><div id="main"></div></body>css代码：#main{width:1000px;height:500px;MARGIN-RIGHT: auto;MARGIN-LEFT: auto;}2、类似百度布局（2）

孛儿只斤·苏日娜

11773人浏览 · 2020-08-24 11:38:44

孛儿只斤·苏日娜 · 2020-08-24 11:38:44 发布

缩放页面不影响布局

1、类似百度布局（1）

在这里插入图片描述
布局时在最外面套一层div，然后给这个div赋一个固定的长宽就可以了。

<body><div id="main"></div></body>

css代码：

#main{
	width:1000px;
	height:500px;
	MARGIN-RIGHT: auto;
	MARGIN-LEFT: auto;
}

2、类似百度布局（2）

<div style="min-width:1050px;min-height:100px;margin-right:5%;margin-left:5%">
	// 页面布局
</div>

3、任意分辨率下页面平铺，缩放到一定宽高出现滚动条

<body><div id="main"></div></body>

css代码：

 html,body {
     width: 100%;
     height: 100%;
     margin: 0;
     padding: 0;
}

body {
    min-width: 1024px;
    min-height: 600px;
    user-select: none; /* 禁止鼠标拖动页面时选中页面文字 */
}

#main {
    width: 100%;
    height: 100%;
}

2048 AI社区

有“AI”的1024 = 2048，欢迎大家加入2048 AI社区

更多推荐

激活青年科创潜能，2025动感地带AI+高校创智计划圆满收官

在AI技术赛道，北京理工大学刘贺雨团队打磨三年的对弈机器人，正从技术探索迈向稳定应用，体现了从“播种算法”到“收获智慧”的持续攀登。青年创客“蹦萨奇”团队、西安明德理工学院的“影动科技”团队和华中科技大学的“数智红韵队”获得内容赛道一等奖，来自中山大学的“AgentR1”团队获得技术赛道一等奖。12月7日的颁奖典礼上，南开大学党委副书记牛文利对赛事给予了高度评价：科创实践是人才成长的重要路径，此次