正文

移动端和pc端的区别有哪些？(代码片段)

枯木前头万木春  枯木前头万木春  2023-01-15  713

关键词：

提示：移动端和pc端的区别：

1.PC考虑的是浏览器的兼容性，而移动端开发考虑的更多的是手机兼容性，因为目前不管是android手机还是ios手机，一般浏览器使用的都是webkit内核，所以说做移动端开发，更多考虑的应该是手机分辨率的适配，和不同操作系统的略微差异化。

2.在部分事件的处理上，移动端多出来的事件是触屏事件，而缺少的是hover事件。另外包括移动端弹出的手机键盘的处理，这样的问题在PC端都是遇不到的。

3.在布局上，移动端开发一般是要做到布局自适应的，需要熟练使用rem布局

4.在动画处理上，PC端由于要考虑IE的兼容性，所以通常使用JS做动画的通用性会更好一些，但是CSS3做了很大的牺牲，而在手机端，如果要做一些动画、特效等，第一选择肯定是CSS3，既简单、效率又高。

5.微信的一些接口组好能去实现一遍，熟悉一下肯定是有好处的，比如通过微信分享文章，title、description、icon等图标的配置，这些还是要会的。

6.百度地图的一些API接口对于移动端来说，LBS是一个非常重要的特性，所以地图这块肯定是要了解的，在加上百度地图这块已经是一个比较成熟的平台了，所以学起来也比较容易。

7.CSS3的动画在移动端用的还是比较多的，但同时也要注意性能。

8.一般PC端用jquery，移动端用zepto，因为移动端的流量还是比较重要的，所以引入的资源或者插件，能小则小，一个30k的资源和一个80k的资源，在移动端的差别还是挺大的。未压缩的jquery是262kb，压缩的jquey是83kb。未压缩的zepto是54kb，压缩的zepto只有9kb。

9.最好能掌握一套完整的前端开发架构，比如模块化、打包、压缩、缓存有条件的还可以做一下自动化测试等等。

10.性能优化，包括首屏的打开速度、用户响应延迟、渲染性能、动画帧率等在手机上都需要特别注意。

前端开发中pc端和移动端的区别

前端开发中PC端和移动端网站的区别，主要是：1、PC端在开发过程中考虑的是浏览器兼容性，移动端开发中考虑的是手机兼容性问题，做移动端开发，更多考虑的是手机分辨率的自适应和不同手机操作系统的略微差异化；2、在部... 查看详情

js实现一个可以兼容pc端和移动端的div拖动效果(代码片段)

...要一个相差不多的需求，就正好用上了，但是在移动端的时候却碰到了问题，拖动时候用到的三个事件：mousedown、mousemove、mouseup在移动端都不起任何作用。毕竟移动端是没有鼠标的，查资料后发现，在移... 查看详情

vuejs自定义指令实现移动端和pc端的div随意拖拽。(代码片段)

在Vue里提倡操作虚拟dom尽量不操作真实是dom。但在频繁操作dom的情况下显然体验不好，使用Js操作真实dom来实现div的随意拖拽。这里为了复用，写成了指令，方便其他页面使用，直接调指令，不需要重复写。pc... 查看详情

移动端和pc端有什么区别

1.PC考虑的是浏览器的兼容性，而移动端开发考虑的更多的是手机兼容性，因为目前不管是android手机还是ios手机，一般浏览器使用的都是webkit内核，所以说做移动端开发，更多考虑的应该是手机分辨率的适配，和不同操作系统的... 查看详情

前端如何优雅的实现跨终端开发（pc端+移动端）(代码片段)

...询。解决方案二：写两套代码，分别应用于PC端和移动端。推荐方案：使用CabloyJS相关链接解决方案一：使用CSS媒体查询。这是传统的解决方案。使用一套代码，先做PC端，再根据视口调节移动端样式。伪代... 查看详情

swiper移动端和pc端的常用解决方案

参考技术A1.利用watchSlidesVisibility和[clickedIndex]制作宽度超出后自动适应的导航2.pc鼠标/方向键控制轮播行为3.mousewheelForceToAxis可用html5页面html：同上4.对imag的操作中具有lazyLoading的功能5.loop功能(类似产品展示)6.zoomToggle.是否允许双... 查看详情

thinkphp实现移动端和pc端显示不同的模板(代码片段)

...样就可以首先执行这里的函数了。所以在这里判断是否是移动端访问的，判断方法如下：functionismobile()//如果有HTTP_X_WAP_PROFILE则一定是移动设备if(isset($_SERVER[‘HTTP_X_WAP_PROFILE‘]))returntrue;//此条摘自TPM智能切换模板引擎，适合查看详情

vue解决移动端和pc端适配(代码片段)

//App.vuemounted()if(this._isMobile())alert("手机端");//this.$router.replace(‘/m_index‘);elsealert("pc端");//this.$router.replace(‘/pc_index‘);,methods://App.vue_isMobile()letflag=navigator.userAg 查看详情

前端入门教程---从0开始手把手教你学习pc端和移动端页面开发第10章有路网pc端主页实战整合(代码片段)

本教程案例在线演示有路网PC端有路网移动端免费配套视频教程免费配套视频教程教程配套源码资源教程配套源码资源制作有路网首页有路网首页布局框架制作划分区域，确定div测量各个区域的宽高使用Flexbox对网页进行布局youlu-... 查看详情

前端入门教程---从0开始手把手教你学习pc端和移动端页面开发第10章有路网pc端主页实战整合(代码片段)

使用vue实现简单键盘，支持移动端和pc端(代码片段)

...定义的键盘，本例子中使用vue2实现个简单的键盘,支持在移动端和PC端使用，欢迎点赞实现效果：Keyboard.vue<template><divclass="keyboard"v-show="showKeyboard"v-clickoutside="closeModal&quo 查看详情

自动识别pc端移动端，并跳转(代码片段)

pc端与移动端的区别

移动设备和PC本身有区别：　　1、屏幕尺寸不同，屏幕大小导致显示的内容页不一样。　　2、网络速度不同：手机分2G、3G、4G、WIFI等，我们要少用图片，JS、动画等等，用户打不开一样起不了作用。　　3、使用习惯不同：按钮... 查看详情

一个vue项目同时兼容pc和移动端(代码片段)

项目场景：vue开发的项目，既有移动端又有pc端，但是移动端和pc端展示的内容不一样，同一个组件样式也不一样，移动端展示内容比pc端少，那这个时候在一个项目种怎么做的？解决方式：路由写... 查看详情

前端入门教程---从0开始手把手教你学习pc端和移动端页面开发第9章flexbox实战有路网(代码片段)

本教程案例在线演示有路网PC端有路网移动端免费配套视频教程免费配套视频教程教程配套源码资源教程配套源码资源制作有路网水平导航菜单category-nav.css.red-navheight:38px;background-color:#d80000;width:100%;.red-navuldisplay:flex;width:1200px;marg... 查看详情

移动端开发框架入门

移动端框架和传统框架的区别：移动框架在于快速开发一下项目，而手机端和pc端的适配主要是靠bootstrap来做的 zepto和mobile比较适合，在移动端有很多触摸事件，而在pc端则是很多的点击事件这些另外针对移动端的设备，比如... 查看详情

酷播v4更新了，支持pc端和移动端的视频预览功能（收费预览视频功能）

感觉要变天了，灰蒙蒙的。好久没有下雨了...[酷播V4]永久免费的酷播V4，更新了html5和flash播放器的优先级选项，效果：效果演示：http://www.cuplayer.com/CuPlayer/demos/basic/playerCrossV5/index.html免费下载：http://52player.89525.com/VideoPlayer/2016/1... 查看详情

pc端和移动端都支持视频video自动播放的代码(代码片段)

需求说明今天有个朋友微信上说目前他们在做抖音短视频的内容创作，方向是国家级非物质文化遗产「汝瓷」，想在他们官方网站上增加短视频的功能，将抖音的内容页上传到网站上。其实这个功能并不复杂，只... 查看详情