3.4 vw + rem布局
确定基准值以常见的750px设计稿为例(宽度),根据vw单位和rem单位原理实现
在750px设计搞下,如果使用vw单位换算,可以理解成100vw = 750px,1px = 0.13333333vw;如果使用rem单位换算,预设1rem = 100px; 则100px = 13.333333vw
html{
font-size: 13.333333vw;
}
弊端 : 不是很精确
```css
750px 100vw 1vw = 7.5px;
375px 100vw 1vw = 3.75px
以设计稿为准:
假设还是750px设计稿 750px=100vw 1px=0.1333vw;
预设字体基础值 100px 1rem = 100px = 13.33vw;
html {
font-size:13.33vw;
}
.box1 {
width: 0.4rem;
height: 0.8rem;
background: pink;
}
/*width:40px;
height: 80px; */
```
## 15.4移动端项目
### 项目介绍
#### 项目名称:
小U商城
#### 项目描述
小U商城是面向移动端的专业综合网上购物商城,我们要完成 首页、列表页、详情页等静态页面的制作
#### 技术选型
布局采取rem适配布局
#### 设计图尺寸
本设计图采用 750px 设计尺寸
#### 开发工具
- VScode
- 蓝湖
————————————————
版权声明:本文为CSDN博主「m0_74899852」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/m0_74899852/article/details/129169528