rem 量图计算公式：获取比值：设备尺寸/设计图尺寸 例如：设备宽度尺寸为 375px 、设计图尺寸为750px，计算获得比值为0.5，量得设计图上某个图片元素宽度为 100px，实际在375px宽度的设备上此元素为 100 * 0.5 = 50 px。故：设置html 下font-size 默认值为 0.5px，为了计算方便一般会以100倍计算，也就是50px，
转载
2023-06-08 13:05:43
473阅读
原文链接：http://caibaojian.com/simple-flexible.html//code from http://caibaojian.com/simple-flexible.html<style id="rootFontSize">html{font-size: 100px !important;}</styl
转载
2017-11-20 10:54:20
1003阅读
!function(n){ var e=n.document, t=e.documentElement, i=720, d=i/100, o="orientationchange"in n?"orientationchange":"resize", a=function(){ var n=t.cli
转载
2020-12-07 14:54:00
134阅读
2评论
引入require.js，可以解决的问题：（1）实现js文件的异步加载，避免网页失去响应；（2）管理模板之间的依赖性，便于代码的编写和维护。 它的模块管理遵循AMD规范（Asynchronous Module Definition - 异步加载模块规范）；所谓AMD规范，就是为了解决模块化编程带来的代码加载先后顺序问题，以及常规为解决该阻塞问题方式带来的各种附加问题。核心是通过define方
1：解释器/编译器 我们需要格外注意的是：.class->机器码(一串二进制) ，这一步 JVM 类加载器首先加载字节码文件，然后通过解释器逐行解释执行(慢)+JIT运行时编译，下次可以直接使用(快)。所以机器码的运行效率肯定是高于 Java 解释器的。这也解释了我们为什么经常会说【Java 是编译与解释共存的语言】 。
解释器:程序需要迅速启动和执行时立即开始工作，默认选择的方式，一行一
文章目录Node.js 简介Node.js 各平台安装配置WindowsLinuxMac OSnode小试牛刀文件操作网络操作 Node.js 简介Node.js 就是运行在服务端的 JavaScript的解析器，是一个基于ChromeV8引擎的JavaScript 运行平台。运行在浏览器中的JS的用途是操作DOM，浏览器就提供了document之类的内置对象。运行在NodeJS提供了fs、ht
转载
2024-09-02 12:59:34
66阅读
为什么要使用rem之前有些适配做法，是通过js动态计算viewport的缩放值（initial-scale）。例如以屏幕320像素为基准，设置1，那屏幕375像素就是375/320=1.18以此类推。但直接这样强制页面缩放过于粗暴，会导致页面图片文字失真模糊。Px是相对固定单位，字号大小直接被定死，所以用户无法根据自己设置的浏览器字号而缩放，em和rem虽然都是相对单位，但em是相对于
rem是CSS3中新增加的一个单位值，他和em单位一样，都是一个相对单位。不同的是em是相对于元素的父元素的font-size进行计算；rem是相对于根元素html的font-size进行计算。这样一来rem就绕开了复杂的层级关系，实现了类似于em单位的功能。Rem的使用前面说了em是相对于其父元素来设置字体大小的，这样就会存在一个问题，进行任何元素设置，都有可能需要知道他父元素的大小，在我们多次
移动端布局长度单位转换一、场景描述二、实现方式1.安装2.配置3.其他配置三、多规则配置 一、场景描述一般我们做移动端网页开发时，设计稿一般都是固定的宽高的（比如750*1334）。但是实际上手机的屏幕大小千奇百怪，各种各样都有。这就要求我们开发人员很好的去处理兼容性问题。一般做长度兼容有两种方式，一种是使用rem，一种是使用vw、vh。这里就说一下将px转换为vw、vh。二、实现方式众所周知，
转载
2024-10-03 15:28:40
68阅读
使用rem是为了界面响应不同尺寸的手机，引入下面的方法就可以使用rem了。 使用这个方法的代码：
原创
2022-05-12 17:26:29
679阅读
前端开发中还原设计图的重要性毋庸置疑，目前来说应用最多的应该也还是使用rem。然而很多人依然还是处于刀耕火种的时代，要么自己去计算rem值，要么依靠编辑器安装插件转换。而本文的目标就是通过一系列的配置后，在开发中可以直接使用设计图的尺寸开发，项目为我们自动编译，转换成rem。技术栈vue-cli：使用脚手架工具创建项目。postcss-pxtorem：转换px为rem的插件。自动设置根节点html
引入 <script src="js/rem.js"></script> 引入rem.js后 样式添加 body{ /*width: 100%; height: 100%;*/ background-color: #F6F6F6; font-size: 0.5rem; text-align: cen ...
转载
2021-09-11 15:34:00
203阅读
2评论
适配方案:目前移动端适配方案有两种:1.flex+rem单位 当前市面上用的比较多 相对主流(比如小米和淘宝移动端)2.flex+viewport width/viewport height(vw/vh)单位 这是一个比较新兴的适配方案 属于未来使用的一个趋势(如b站移动端)让flex做布局（盒子摆放），让rem或者vw/vh 实现网页元素的尺寸（宽度和高度）适配屏幕这篇主要是来说说这两种适配方案
/**
* 文档坐标
* 视口坐标
* 鼠标坐标
*
* 元素位置和尺寸
*/
function xx() {
// 最大可滚动的大小 = 可滚动的大小 - 可视区域的大小
var scrollMax = d1.scrollHeight - d1.clientHeight; // 如果最大可滚动的大小 - 已滚动的大小 >= 阀值
谈谈利用JavaScript结合相对单位rem实现自适应布局的简单而实用的方法rem是css3新增的一个相对单位，相对的只是HTML根元素，可以只修改根元素字体大小就可以成比例地调整所有字体大小。我们可以巧妙地利用这一特性，实现页面自适应布局。demo:https://github.com/XieTongXue/how-to/tree/master/pay-h5需求：当我们拿到一张设计稿，比如UI
转载
2024-10-19 18:35:33
128阅读
元素样式1.操作内联样式修改内联样式：通过JS修改元素的样式语法： 元素.style.样式名 = 样式值;注意是：如果CSS的样式名中有- 这种情况下需要使用驼峰命名法，去掉-，然后将-后的字母修改成大写但是如果在样式中写!important，则此时样式会有最高的优先级，即使通过JS也不能覆盖该样式，此时将会导致JS样式失败，所以尽量不要为样式添加!important读取内联样式：语法： 元素.s
转载
2024-10-21 15:48:29
57阅读
说明因为最近需要实现前端导出 excel 文件，并且对导出文件的样式进行一些修改，比如颜色、字体、合并单元格等，所以我找到了 xlsx-style 这个项目，它可以对导出的 excel 文件进行一些样式上的修改，这个项目是 SheetJS 的一个分支。其实 SheetJS 也是支持修改导出文件的样式的，不过是在它的专业版中， SheetJS 分为社区版和专业版的，社区版是开源的，但是却不支持修改导
什么是前端适配 从ui展示层面上： 我们期望不同尺寸的设备，页面可以自适应的展示或者进行等比缩放，从而在不同的尺寸的设备下看起来协调或者差不多。从代码实现层面上： 我们希望前端适配可以用用尽可能简洁的代码来实现，最好一套代码实现兼容所有设备，而不是对每个或者每种设备都写一套方案，不是次次都选用最无奈的方案（android和ios分开便编写）2.关键字2.1
我们在构建企业级应用时，通常会遇到各种各样的定制化功能，因为每个企业都有自己独特的流程、思维方式和行为习惯。有很多时候，软件企业是不太理解这种情况，习惯性的会给出一个诊断，『你这么做不对，按逻辑应该这样这样』。但企业往往不会接受这种说法，习惯的力量是强大的，我们一定要尊重这种事实。所以在构建企业应用的时候，我们不仅仅要了解对方的基本需求，也要了解他们习惯于怎么处理流程，在设计的时候需要予以充分重视
一:什么是require.js①：require.js是一个js脚本加载器，它遵循AMD(Asynchronous Module Definition)规范，实现js脚本的异步加载，不阻塞页面的渲染和其后的脚本的执行，并提供了在加载完成之后的执行相应回调函数的功能；②：require.js要求js脚本必须要实现模块化，即文件化；而require.js的作用之一就是加载js模块，也就是js文件。③：
转载
2024-10-12 13:08:19
0阅读
