这是根据不知名茶效果图相应png文件来重构的部分成果
- 缩放水平border出现错位
- input输入框光标具体显示位置
- 每行元素布局如何进一步优化,在缩放过程中等比例变化以至于不会变形
- 由于手头只有设计图的PNG文件,所以只是用绘图工具简单的做了遮挡处理
- 第一个input垂直位置所占百分比:目前50%
- 两个input高度差:目前36px
- input
- width:目前225px
- border-radius:目前10px
- 手机号
- 到border-left距离:目前25px
- font-size:目前14px
- font-family:"SimHei""Microsoft YaHei";
- 进入不知名茶世界
- font-size: default
- font-family: default
- 第一个input垂直位置所占百分比:目前42%
- 水平高度差 自上而下 依次为: 12px 40px 16px 36px
- span
- 宽度: 目前128px
- font-family:"SimHei""Microsoft YaHei"
- font-size: 14px
- input
- 宽度:128px 285px
- font-family:"SimHei""Microsoft YaHei"
- font-size: 14px
- 密码、重复密码 到 border-left 距离:6个 
- 验证码placeholder设置样式
- 第一个input垂直位置所占百分比:目前50%
- 水平高度差:目前36px
- input
- 宽度:285px
- font-family:"SimHei""Microsoft YaHei"
- font-size: 14px
- 密码 到 border-left 距离:5个 
- 下拉菜单为了实现透明采用ul+li来实现
- 水平方向若干个 div 若高度不等,会向下对齐。理想状态时向上
- 最下方“取消”和“确认”具体位置(精确到像素)