东营建网站公司,富阳区建设工程质监站网站,彩页设计画面元素,网站空间管理地址布局准备工作及布局思想及概念: 一个显示器#xff08;pc端显示器 及 手机屏显示器#xff09;#xff0c;既有物理像素#xff0c;又有独立像素#xff08;独立像素也叫作css像素#xff0c;用于前端人员使用#xff09;#xff1b; --重要 首先确定设计稿的尺寸… 布局准备工作及布局思想及概念: 一个显示器pc端显示器 及 手机屏显示器既有物理像素又有独立像素独立像素也叫作css像素用于前端人员使用 --重要 首先确定设计稿的尺寸然后在对应的手机屏幕尺寸上进行开发 设计稿的尺寸比如320/16 1ren等于多少20px 然后布局的时候测量设计稿某个区域的宽度比如测量的宽度是100px100px转换为rem的步骤为100/20 5rem100px 改写成 5rem 在写js交互的时候如果不确定原设计稿的尺寸的话则就把任意一个手机屏幕的尺寸当成原设计稿的尺寸即可比如在苹果5下进行操作。则就当原设计稿的是苹果5屏幕的尺寸。然后在查看下html的字体大小剩下的该怎么操作就怎么操作 为什么不同的的设备显示的比例是一样因为尺寸越大html的font-size越大尺寸越小html的font-size越小; 是等比例也就是1rem在不同的设备浏览器上等于不同的像素。、viewport设置的是浏览器可视区窗口的宽度,手机的屏幕宽度不属于浏览器可视区手机屏幕的宽度和浏览器可视区的宽度不是一个东西 --》重要 ( viewport ) gif图 详解 浏览器模拟手机参数详解图解 手机屏幕独立像素和物理像素数据库参考图 转载于:https://www.cnblogs.com/aalg/p/9496260.html
