引入对应的脚本:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<!--引入淘宝lib-flexible布局-->
<script src="./index.min.js"></script>
<!--引入淘宝lib-flexible布局-->
<!--设计稿给出750px的设计图，然后对应除去75就为样式的rem， 比如设计稿的元素宽度是75px, 那么样式直接写1rem就可以了-->
<link href="./h5.css" rel="stylesheet" />
<title>H5淘宝移动端布局方案</title>
</head>
<body>
<ul>
<header>header</header>
<div class="box">
<div class="left">left</div>
<div class="right">right</div>
</div>
</ul>
</body>
</script></script>
</html>
css代码：
* {
margin: 0;
padding: 0;
}
/********设计稿给出750px的设计图，然后对应除去75就为样式的rem， 比如设计稿的元素宽度是75px, 那么样式直接写1rem就可以了***********/
header {
width: 10rem;
height: 1.5rem;
background: red;
font-size: 0.36rem;
}
.box {
margin: 0 auto;
width: 6.9466rem;
height: 6.173rem;
background-color: #515b66;
background: blue;
font-size: 36px;
}
.box .left {
float: left;
width: 3.2rem;
height: 1rem;
background: green;
}
.box .right {
float: left;
width: 4.3rem;
height: 1rem;
background: yellow;
}设计稿给出750px的设计图，然后对应除去75就为样式的rem， 比如设计稿的元素宽度是75px, 那么样式直接写1rem就可以了
