原文:前端pc版的简单适配

我们都知道对于前端pc版本的适配是一个难题,大部分都是做的媒体查询。但是有时间公司不要媒体查询 就是需要不管多大的屏幕都是满屏显示。我就在考虑为啥不用rem给pc端做个适配。 我是基于设计图是 的做的简单的js适配。 lt script type text javascript gt var winWidth document.documentElement.offsetWidth documen ...

2018-11-01 00:21 0 2943 推荐指数:

查看详情

前端PC端页面,适配解决方案

代码正常写,在最下面引入此js代码。完美解决适配问题! 代码如下: const baseWidth = 1920; const baseHeight = 1080; let timer = null; let calcScale ...

Thu Apr 22 19:07:00 CST 2021 0 829
一个简单PC端与移动端的适配(通过UA)

只需在header引用个js文件, 原理就是判断UA里面的标识. 加下面代码添加到js文件,在头文件引用即可 var Pc_url = 'http://www.baidu.com'; //PC端网址var Phone_url = 'http://www.sougou.com'; //手机端网址 ...

Tue Jan 02 19:38:00 CST 2018 0 1145
VUE之PC大屏适配

PC屏幕适配主要使用两个插件: 1、postcss-plugin-px2rem:用于将项目中的px自动转换成ren; 2、lib-flexible:用于针对不同屏幕进行适配; lib-flexble: lib-flexible会自动在html的head中添加一个 meta ...

Tue Aug 31 00:44:00 CST 2021 0 387
vue适配pc和移动

PC适配:   媒体查询 ,flex rem (PC适配主要使用媒体查询+百分比) 移动适配:   主要使用 rem+flex 也有用JS代码断实现 vue脚手架 移动适配:   核心思路-》根元素大小-页面尺寸和rem的关系   1,将根元素的大小设置 ...

Sat Apr 04 07:31:00 CST 2020 0 2036
pc端使用rem适配

$(function(){ var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值 var wH = window.innerHeight;// 当前窗口的高度 ...

Tue Jun 23 17:48:00 CST 2020 0 2617
pc端页面适配思路

对于pc端网页的适配,笔者大体的适配方法就是在整体布局div时,尽量让width、height都使用百分比方式,而对于内部div,以及元素之间的margin、padding、width、height等属性,使用rem来进行适配。直接贴代码说明原理。 整体思路便是这样,而要让页面渲染完成之前 ...

Thu Nov 12 00:44:00 CST 2020 1 1049
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM