从事Android开发也有一小段时间了,总结一下工作流程,梳理从产品需求提出到版本发布的各个步骤,希望自己能够坚持把每个环节做到最好。1、需求评审产品经理收集提炼出版本需要迭代的需求,拉上相关的角色进行评审。开发角色需要对需求中不确定的点进行讨论,预想技术实现方案,并评估可行性,也需要及时提出自己的疑问。2、技术方案评审1)当需求中涉及到多方,包括前端(H5、小程序),后台的时候,需要对其中的通信
转载
2024-03-17 13:26:37
32阅读
移动端:运行在移动设备上的产品移动设备:手机、平板、touch...我们以后做的产品大部分都只需要适配IOS系统和安卓系统即可响应式布局:在不同的设备上都能给予客户最好的操作体验产品:APP:手机应用,目前市面上流行的APP产品大部分都是原生APP开发者做的,但是目前市场上正在趋于使用JS来开发原生的APP:react native、phoneGap...H5:HTML页面,都是运行在浏览器中的
当我们准备在移动端写HTML的时候,首先需要考虑到手机显示屏幕的大小与PC的差异性。我们可以通过两种方式进行媒体查询来区分移动端和PC端的访问用户。第一种,<style>
@media (min-width:500) and (max-width: 1000px)
.class{ background: #ccc; }
</style>当屏幕尺寸大于500像素且小于1000
一,原因既然看到这篇博客,说明各位已经知道为啥要做rem适配,以及rem适配的原理。 写这篇博客的原因在于,网上很多postcss-pxtorem 插件的配置都无法生效(原因在于创建项目的工具如vue-cli版本等的不同),生生地浪费了很多时间。于是重新整理下,套用下个神棍点地说法,就是亲测有效~~哈哈。二,使用postcss-pxtorem 的方法0,无效原因我的项目是使用vue-cli3创建的
至今除了小程序没怎么接触过移动端,问了下朋友移动端都是怎么做适配的 1.rem,这个单位转换比较麻烦,特意问了下有没有什么可以自动转的,这里给出一个叫px2rem-loader的工具,和lib-flexible一起使用的 2.boots tarp这个框架,,已经很久没用了,留个标记需要的时候去捡起来 ...
转载
2021-08-19 16:02:00
229阅读
2评论
1、移动端系统包括:// Ios、android、windows phone、black berry2、移动端的浏览器// safari、chrome、firefox3、屏幕尺寸:1、像素
设备像素 pt(物理像素/尺寸、分辨率)、
css像素px(视觉像素/尺寸)
2、屏幕尺寸 (对角线指的是xxx英寸)// 通常iphone6 1334x750指代的是屏幕宽高的发光点数3、PPI,像素密度&
插件安装npm install postcss-px2rem -Snpm install px2rem-loader -Snpm install lib-flexible -S使用build目录下vue
转载
2022-05-26 12:23:20
341阅读
安装npm install px2rem-loader lib-flexible --save 入口文件main.js加上import 'lib-flexible
原创
2022-03-08 14:40:36
435阅读
安装npm install px2rem-loader lib-flexible --save 入口文件main.js加上import 'lib-flexible/flexible.js'在index.html加上 <meta name="viewport" content="width=device-width,initial-scale=1.0"> <met...
原创
2021-08-26 11:21:26
512阅读
前端页面适配 不同设备分辨率不一样,因此需要页面适配 前端如何做页面适配? css媒体查询实现响应式布局 这种方式的缺陷就是需要编写多套适配样式代码 css3 rem单位 W3C对rem的定义: font-sise of the root Element. 即根元素的fontsize大小 rem: ...
转载
2021-09-24 00:38:00
929阅读
2评论
npm i vant -S //安装vantnpm i babel-plugin-import -D //按需引入在plugins文件夹新增vant.js文件引入Button组件为例
原创
2022-07-06 16:38:36
1403阅读
前端开发中还原设计图的重要性毋庸置疑,目前来说应用最多的应该也还是使用rem。然而很多人依然还是处于刀耕火种的时代,要么自己去计算rem值,要么依靠编辑器安装插件转换。而本文的目标就是通过一系列的配置后,在开发中可以直接使用设计图的尺寸开发,项目为我们自动编译,转换成rem。技术栈vue-cli:使用脚手架工具创建项目。postcss-pxtorem:转换px为rem的插件。自动设置根节点html
转载
2024-02-26 12:46:39
280阅读
一、vw px rem em是什么1.vw:就是相对视口宽度(Viewport Width)。1vw = 1% * 视口宽度。也就是说,一个视口就是100vw。2.px:px应该是在css中使用最为普遍的单位了吧。px是屏幕设备物理上能显示出的最小的一点。这个点不是固定宽度的,是相对长度单位。在桌面浏览器中,1个像素往往是对着电脑屏幕的1个物理像素,但是
转载
2020-04-24 19:35:00
1920阅读
2评论
目录1、创建一个项目并启动2、设置根字体大小和单位转化3、去掉边框距离4、css的嵌套使用5、连接到手机上显示6、vant ui 库的使用6.1 基础用法6.2 底部导航栏7、模拟锤子商城7.1 请求数据7.2 解决跨越7.3 组件切换7.4 轮播图的实现 1、创建一个项目并启动npm init vue@latestcd demonpm installcode .npm run dev2、设置根
第一步 : npm install lib-flexible postcss-pxtorem -S 第二步: 运行指令展示出 webapck.config.js 文件 npm run ejectAre you sure you want to eject? This action is perman ...
转载
2021-04-23 16:29:00
1448阅读
2评论
px、em、rem区别介绍PXpx像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。PX特点1. IE无法调整那些使用px作为单位的字体大小;2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;3. Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(或内核)。EMem是相对长度单位。相对于当前对象内文本的字体尺寸。如当前
px:绝对单位,页面按精确像素展示。
em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。
rem:相对单位,可理解为”root em”, 相对根节点html的字体大小来计算,CSS3新加属性,chrome/firefox/IE9+支持。
通过它既可以做到只修
原创
2022-11-07 11:35:46
87阅读
1.什么是rem来自于鹅厂ISUX团队的解释如下: rem(font size of the root element)是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。看到rem大家一定会想起em单位,em(font size of the element)是指相对于父元素的字体大小的
一、rem介绍rem是什么?它的全称是 font size of the root element (根元素的字体大小)它是CSS3中新增加的一个尺寸(度量)单位,根节点(html)的font-size决定了rem的尺寸,也就是说它是一个相对单位,相对于(html)。浏览器的默认字体?浏览器的默认的font-size是16px,1rem默认就等于16px。(chrome最小字体为12px)rem可
转载
2024-06-18 20:31:53
188阅读
px是最常用的CSS长度单位。1px到底多长?CSS长度分为绝对长度和相对长度。 css单位pixel(像素)是图像的基本采样单位。它不是一个确定的物理量,也不是一个具体的点或者小方块(尽管可以用点和小方块来呈现),而是一个抽象概念。 不同的设备,其图像基本单位是不同的,比如显示器的点距,可以认为是显示器的物理像素。现在的液晶显示器的点距一般在0.25mm到0.29mm之间。而
转载
2024-07-21 10:59:01
90阅读