手机端等比例修改步骤

1. 删除

<link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css">
<meta name="viewport" content="width=640, user-scalable=no, viewport-fit=cover">

 

2. 添加属性

* {
box-sizing: border-box;
}
html,
body {
min-width: 1550px;
}
.container {
width: 1430px;
margin: 0 auto;
padding: 0 15px;
}

 

3. 搜索 @media 并将其删除

4. main.js

// 首页padding
function kuan() {
let kuan;
/**
* 新增判断
* 因为手机端 $(window).width() 恒定为 980
*/
if ($(window).width() == 980) {
kuan = 120;
} else {
kuan = $(window).width() - $(".container").width();
}
$(".sy_mk2 .shang_mk2").css("padding-left", kuan / 2);
$(".ps_mk3").css("padding-left", kuan / 2);
// 新加
$(".xinjia_mk1 .ps_mk3").css("padding-left", 0);
$(".xinjia_mk1 .ps_mk3").css("padding-right", kuan / 2);
$(".xinjia_mk1 .shangbg").css("padding-left", kuan / 2);
}
kuan();

 

posted @ 2022-11-07 07:47  wangmeihao  阅读(81)  评论(0)    收藏  举报