一、为什么要使用rem布局前面我写了flex布局的优点，分配伸缩盒容器中子盒子占的份数及排列方式，使其不受屏幕缩放的影响，使布局变得简单。然而，在有些时候，不可避免要给盒子设置高度的值，怎么让高度也随着屏幕大小变化等比例缩放呢？另外，怎么让页面文字大小也随着屏幕的大小变化而缩放呢？rem布局就可以轻松解决这个问题。二、rem布局的原理1.rem首先要了解什么是rem，rem (root em)是一
转载
2024-05-07 14:07:44
160阅读
在我开始写移动端页面至今，一直有2个疑问困扰着我，我只知道结果但不知道为什么问题1：为什么设计师给的设计稿总是640px或750px（现在一般以Phone6为基准，给的750px） 问题2：为什么我们拿到640px和750px的设计稿，在编码的时候都要除以2, （比如设计稿上有一个图标宽高是40*40，我们需要先除以2，实际编码时候宽高要写成20*
转载
2024-04-16 06:52:27
239阅读
Deco 是什么？Deco 智能代码项目是我们团队在「前端智能化」方向上的探索，我们尝试从设计稿生成代码（Design To Code）这个切入点入手，对现有的设计到研发这一环节进行能力补全，进而提升产研效率。通过 Deco智能代码平台，可以实现将设计稿一键生成多端代码在过去的一年里，Deco 已在京东的两次大促中成功落地，在个性化活动会场的搭建中，研发效率提升达到了 48%今天，Deco 对外发
rem布局非常简单，首页你只需在页面引入这段原生JS代码就可以了
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWi
rem的用法rem 相对于根元素字体大小的单位，它是一个相对单位。通常可以有两种方法，第一种是结合媒体查询来做。 第二种是 js 方法。一：媒体查询：使用媒体查询，来控制不同屏幕下的html的字体大小即可。假如一个需求：有个设计图750，在这个图纸上有个div，量出来是 :200px * 200px; 首先我们可以考虑将750的设计稿分为15份（当然那也可以分成10份，这个随意，我为了好计算。），
转载
2024-06-19 07:57:10
309阅读
为何大家都选用750作为移动端页面的宽度尺寸?很多刚入门的ui小伙伴,不知道移动端为什么设计稿要做成750px宽, 今天我来阐述一下自己的想法, 以下是我个人见解,不喜勿喷.对于移动端页面, html的head中有一个<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,
背景如何按照设计稿中标注的尺寸，直接写页面的样式，不再需要px2rem这样的工具或者人工转换 ? 只要你明白了rem的计算原理，这个问题的答案超级简单。根字体大小计算核心原理 设备的根字体大小 * 全屏比例值设计稿的根字体大小 * 全屏比例值这两个等式中的全屏比例值相等的条件下，在真实设备上可以高保真地还原设计稿。实战一下找了一个蓝湖的设计稿，蓝湖的设计稿宽度是750
转载
2024-03-22 13:59:37
790阅读
在 Taro 中尺寸单位建议使用 px、 百分比 %，Taro 默认会对所有单位进行转换。在 Taro 中书写尺寸按照 1:1 的关系来进行书写，即从设计稿上量的长度 100px，那么尺寸书写就是 100px，当转成微信小程序的时候，尺寸将默认转换为 100rpx，当转成 H5 时将默认转换为以 rem 为单位的值。如果你希望部
关于rete算法的介绍，能找到的资料不少，但是往往对初学者不友好，一上来就是一堆Fact，TypeNode，AlphaNode之类的术语，非常容易劝退。这里总结一下自己的学习过程，希望从问题出发，方便理解rete算法本身。举个例子：例如：我们需要将提供“机票+酒店”、“机票+酒店+贵宾休息室”两种类型的产品给旅客。 机票、酒店、贵宾休息室需要满足一些基本的限制条件。并且： “机票+酒店”产品要保障
rem适配方案 作用： 让一些不能等比自适应的元素，达到当设备尺寸发生变化的时候，等比例适配当前设备 使用媒体查询根据不同设备按比例设置html的字体大小，然后页面元素使用rem做尺寸单位，当html字体大小变化元素尺寸也会发生变化，从而达到等比缩放的适配rem实际开发适配方案1rem + 媒体查询 + less技术1、 设计稿常见尺寸宽度设备常见宽度iphone45640pxiphone6787
转载
2024-04-02 15:29:11
519阅读
本篇文章主要讲述JavaScript之独立使用lib-flexible.js适配移动端UI设计750px设计图，希望阅读本篇文章以后大家有所收获，帮助大家对相关内容的理解更加深入。最近在和设计沟通关于设计图尺寸大小和前端实际页面尺寸大小不一致的情况，我们的UI设计是使用的iPone6的，(iphone6: 375px*667px 实际像素：750px*1334
朋友们！大家好！上一章我们完成了小程序项目的tabBar结构框架。今天，我们要做的是对样式做一些处理。 怎么做呢？so easy，就是对页面的样式进行初始化处理。通常情况下，我们写代码会用到通配符 ”* “，如下图中： 但是，在小程序中通配符是不能使用的，会报错！这个小tip 我们之前也重点强调过哈~~大家牢记哦~~ 所以，我们在小程序中是通过手写标签名
Web前端作为开发团队中不可或缺的一部分，需要按照相关规定进行合理编写（一部分不良习惯可能给自己和他人造成不必要的麻烦）。不同公司不同团队具有不同的规范和文档。下面是根据不同企业和团队的要求进行全面详细的整理结果。备注：实际开发请以本公司的规范为标准。A.基本原则符合web标准（UTF-8，HTML5），语义化html（HTML5新增要求，减少div和span等无特定语义的标签使用），结构表现行为
转载
2024-05-17 19:40:16
23阅读
百度百科定义
美工一般是指对平面，色彩 ，基调，创意等进行堆砌的技术人才，分为平面美工、网页美工和三维美工。一般需要精通Photoshop等设计软件。什么是静态页面静态页面又可以称为"伪界面"页面打包后，以.html结尾，在电脑上面可以双击运行，有界面效果美工是怎么设计静态页面的PS自带切片工具可以将整合在一起的素材，生成静态页面步骤(具体见百度)选择切片工具把图片切成合适的内容保存为web格式保
第一次在这里发博客，还不太熟练。希望能记录下自己的学习和成长过程。欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，
一、rem 适配基本概念：
对于移动端的开发，rem 适配必不可少，我们可以用多种方式实现， 根据 html 的 fontSize 属性值为基准，其它所有的 rem 值，根据这个基准计算。我们根据屏幕宽度用 js 动态修改了 html 的 fontSize 属性值，达到移动端适配的目的。
二、布局方案： &
关于对Web前端的学习，众所周知，基础知识需要牢牢掌握。项目经验需要大量积累，二者缺一不可。然而提到切图对Web前端开发的影响，却鲜有人知。下面，千锋就相关切图问题给大家做下系统地梳理。 首先，我们先来简单了解下切图的历史。Web 2.0的时期，最流行的趋势就是大字体、鲜艳色、高光和倒影，甚至许多人没有自己的想法，盲目去追求，致使Web 2.0的网站变得千篇一律。这时有一些前卫的人，把平面设
本篇适用于初次使用rem为单位切图而无从下手的童鞋。核心是根据屏幕动态改变根元素字体大小，以达到适配各种屏幕。这只是一个拿来就用的教程。很多东西没有详细说明。不过对于快速做手机端切图很有帮助。模板：Github使用：1.下载完成后首先修改js文件中的基本单位：psd宽度是640就写640，是750就写750.现在的设计稿大部分是以iphone 6 为基准设计的，也就是750px。2.切图时，我们以
转载
2023-07-09 23:20:21
468阅读
遇到的问题：1：如果给设计稿是1920*1080，和750*1334设计稿你怎么做适配2：怎么合理使用rem,%3：在pc端怎么适配各种大小不一的尺寸电脑4：当页面在刷新出现那么一瞬间样式没有渲染，1秒后又好的情况怎么处理5：使用最小尺寸电脑通常限制到1200 第一：在pc端适配，限制最小尺寸1200保证样式不乱，文字很大的情况下使用rem适配， &
———— / BEGIN / ————PS：本文适用于移动端，Axure软件制作的文档型交互稿。交互稿应该包含哪些内容？如何搭建一个合理的交互稿结构？各个界面应该如何摆放？清晰易读的设计说明应该是怎样的？作为一个新人，很难完全弄清上面的问题。其实想要画出一份合乎规范的交互稿并不难，只需找前辈的稿子参考一下就能习得十之六七。但由于设计稿大多涉及企业机密，有着较强的产权属性，所以一般很难接触到。今天笔
