rem这是个低调的css单位,近一两年开始崭露头角,有许多同学对rem的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃用了.但是我对rem综合评价是用来做web app它绝对是最合适的人选之一. rem是什么? rem(font size of the root element)是指相对于根元素的字体大小的单位.简单的说它就是一个相对单位.看到rem大家一定会想起em单位,em(font size of the element)是指相对于父元素的字体大小的单位.它们之间其实很相似,只不过一…

做移动端自适应时可能很多人都对自适应和dpr之间的关系产生疑问,也有一些人会疑虑比如我的自适应方案没有加dpr会不会出问题,针对这些疑问我说一下我的见解. 1. 什么是尺寸自适应 首先标题说的自适应,可能自适应在不同人眼里理解不同,特别与响应式的关系,在这里说一下我所理解的自适应,和其与响应式的区别.先说响应式设计,响应式设计表示在不同的屏幕尺寸下,都有良好的布局和内容表现,简单一点的说,就是一个页面可以适配多种不同尺寸的屏幕,而且看上去还是设计良好的.为了实现这个目的,可能会利用js或者css…

常用单位 在CSS中可以用很多不同的方式来设定字体的尺寸.一般来说,这些单位被分成两大类:绝对单位(absolute)和相对单位(relative). 绝对单位在大多数情况下是相对于某些实际量度而言的固定值,即是说它们一旦设定,就不会因为其他元素的字体尺寸变化而变化. 相对单位没有一个固定的度量值,而是由父元素尺寸来决定的相对值,它们的尺寸会根据与其相关的元素改变而改变. 下面是对这些单位的一个简单整理: 单位 类型 描述 px Absolute 1个Viewport像素 pt Absolute…

主题 HTML移动端页面开发适配 rem布局原理 什么是适配,为什么要适配 我们拿到的设计图一般是以640,750,1080分辨率为基准设计的,而现在的手机终端各式各样,分辨率不同,逻辑像素不同 ,适口不同,所以为了让我们的页面在每个设备上都可以良好的展示,那么就需要为这些设备做统一的处理,这个过程就称为移动端适配. 需要知道的一些概念: 物理像素(physical pixel) 一个物理像素是显示器(手机屏幕)上最小的物理显示单元,可以理解为我们平时说的分辨率: 设备独立像素(density-…

为什么用rem不用px? 主流:各大网站的移动版绝大多数都是用的rem.   移动端屏幕分辨率差别太大:最低适配的iPhone6,分辨率仅为750*1334.而现在市面上大多数手机,都达到了1080*1920或1080*2340(全面屏). 所有元素都要用rem吗? 大部分时候都是如此,但也有一些例外,比如文字的font-size,可能直接设为如17px,直接写死.一些近乎占满整个宽度的banner,可能它的样式会是这样:(width: 100%;padding: 0 10px;),即左右宽度也…

常用单位 在CSS中可以用很多不同的方式来设定字体的尺寸.一般来说,这些单位被分成两大类:绝对单位(absolute)和相对单位(relative). 绝对单位在大多数情况下是相对于某些实际量度而言的固定值,即是说它们一旦设定,就不会因为其他元素的字体尺寸变化而变化. 相对单位没有一个固定的度量值,而是由父元素尺寸来决定的相对值,它们的尺寸会根据与其相关的元素改变而改变. 下面是对这些单位的一个简单整理: 单位 类型 描述 px Absolute 1个Viewport像素 pt Absolute…

<精通Matlab神经网络>书中示例10-16,在创建BP网络时,原来的写法是: net = newff(minmax(alphabet),[S1 S2],{'logsig' 'logsig'},'traingdx'); 因为运行过程中有提示,自然想改成新写法(参考之前的随笔<MATLAB神经网络函数NEWFF()新旧用法差异>): net = newff(alphabet, targets, S1, {'logsig', 'logsig'}, 'traingdx'); net.d…

IOS数组.字典.NSNumber 新写法—— @[].@{}   //标准写法 NSNumber * number = [NSNumber numberWithInt:]; NSArray * array = [NSArray arrayWithObjects:@"one", @"two", nil]; NSDictionary * dict = [NSDictionary dictionaryWithObjectsAndKeys:@"value1&qu…

要想移动端适配 并使用 rem  您需要先看这篇文章,配置好less ➡️ 在vue 中使用 less,就可以使用rem了 如果项目已经开发的差不多了,没有用到rem 又要使用rem,您用这招. postcss-pxtorem:转换px为rem的插件 安装 postcss-pxtorem npm install postcss-pxtorem --save 新建rem.js文件 const baseSize = 32 // 设置 rem 函数 function setRem () { // 当前…

题目地址:http://poj.org/problem?id=1703 Sample Input 1 5 5 A 1 2 D 1 2 A 1 2 D 2 4 A 1 4 Sample Output Not sure yet. In different gangs. In the same gang. 题目解读:T组数据,每组输入n m,n代表有n个人, m代表有m次操作.操作A x y:表示询问x y的关系是怎样的? 三中情况:不确定,属于同一个集合, 不属于同一个集合操作D x y:表示x y…

本来想写一篇,webapp使用Rem的问题,查了一下相关rem的介绍之后,发现很多平台已经解释的很清楚了,图文并茂,于是我便想将其解释资源整理一些,方便以后自己查阅. 腾讯ISUX:web app变革之rem(解释的最精辟了) 大漠博客:CSS3的REM设置字体大小 小黑成长录:关于webapp中的文字单位的一些捣腾 前端观察站:px em rem在WEB前端开发中的区别 这里面需要注意的一点就是,ren是根据根元素的字体大小来确定的: 我们可能经常设置html{font-size:20px}或…

1. 页面宽度320, 所有元素尺寸设一半 缺点:不自能适应全屏 2.页面宽度640,元素尺寸正常 <meta charset="utf-8" /> <meta name='viewport' content='width=640, user-scalable=no, target-densitydpi=device-dpi' /> <meta http-equiv="keywords" content="" /&g…

1.媒体查询:@media only screen and (max-width: ) {},在最初做pc端时,使用各种媒体查询,因为pc的屏幕分辨率总共就几种,不嫌麻烦的重复使用类名.有很大的缺陷就是UI给的设计稿宽度是一定的,在做响应式式凭借自己的感觉是一种超级不爽的美感纠结症. 2.百分比:百分比也是相当的麻烦,还要去各种计算,不是程序员该做的笨重事. 3.em:缺陷是父盒子的百分比. 自己探索了一条自己选择走的捷径,不用在担心宽度和高度不等比例适应,也不用担心在各分辨率下的布局会出现问题…

背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范往往会遵循以下两点: 1)首先,选取一款手机的屏幕宽高作为基准(以前是iPhone4的320×480,现在更多的是iphone6的375×667). 2)对于retina屏幕(如: dpr=2),为了达到高清效果,视觉稿的画布大小会是基准的2倍,也就是说像素点个数是原来的4倍(对iphone6而言:…

做一个PC端的网页,设计图是1920X1080的. 要在常见屏上显示正常(比例正确可) 1280X720 1366X768 1440X900 1920X1080 使用了几种办法 1.内容在一屏内显示的,采用了(内容框)上下左右居中的办法,里面的内容绝对于这个内容框定位.这样一来,在不同大小屏中,内容总是在中间,看起来较正常 2.使用rem的地方 width,height,margin,padding,left top都采用了REM, HTML的FONT-SIZE设置的为100PX.是为了计算方便…

之前在工作中写过一些Socket客户端与服务端的代码,但是当时没有时间仔细研究,只能不报错先过的态度,对其细节了解不深,写的代码有各种问题也浑然不知,只是业务量级以及对接方对接代码没有出现出格的情况所以问题不得暴露. 首先通过单线程Socket做服务端是一种BIO的做法,这种做法会导致服务端只能同时接收一笔请求,性能非常差 下面我把BIO的代码帖一下,有需要的同学可以参考 服务端 public class SocketIO { //客户端编码,客户端发送编码与服务端一致,则服务端无需进行解码特殊…

使用方式: 在html页面开头,引入下面的原生js代码 (function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth; if (!clientWidth) return; ){ d…

一.vw px rem em是什么 1.vw:就是相对视口宽度(Viewport Width).1vw = 1% * 视口宽度.也就是说,一个视口就是100vw. 2.px:px应该是在css中使用最为普遍的单位了吧.px是屏幕设备物理上能显示出的最小的一点.这个点不是固定宽度的,是相对长度单位.在桌面浏览器中,1个像素往往是对着电脑屏幕的1个物理像素,但是在移动端,随着Retina屏的流行,分辨率提高了.css中的1px并不等于设备的1px.比如苹果三手机,分辨率是320 x 480.苹果四手…

REM适配 基础配置 在页面布局之前,对REM进行配置,以适配移动端特点. 官方参考 Vant文档---->快速上手---->进阶用法---->Rem适配----> Vant 中的样式默认使用px作为单位,如果需要使用rem单位,推荐使用以下两个工具: postcss-pxtorem 是一款 postcss 插件,用于将单位px转化为 rem. lib-flexible 用于设置 rem 基准值,设置 font-size 基准值. 注意:rem单位值 = px像素值 / rootV…

最近发现了一个移动端调试的新技能,这里简单描述一下基本情况. 移动端调试常遇到的问题 手机访问只能看到页面的展现,除此之外看不到任何其他信息 无法像调试PC页面那么方便的查看js.dom.network.cookie.storage等信息 js调试只能通过alert来提示了,当然经验丰富的开发者,会制作一个简单的调试信息展示页面,相当于控制台的功能. debuggap简介 run easily and debug powerfully 无需安装,就可以在windows.linux和mac上运行…

本文主要分析服务端新连接的接入过程,主要分为以下 3 各步骤: select 操作: processSelectedKeys 操作. 1. select 操作 在分析 select 操作前,先要回顾一下 NioEventLoop 的 run()方法及其父类 SingleThreadEventExecutor 的 execute(Runnable task)方法. @Override public void execute(Runnable task) { if (task == null) {…

这几天做demo,看了网上教程有用到尺寸单位vh,vw, 这些单位不是很熟悉,所以上网上找了些资料来认识了这些不认识的单位 1.em 在做手机端的时候经常会用到的做字体的尺寸单位 说白了 em就相当于“倍”,比如设置当前的div的字体大小为1.5em,则当前的div的字体大小为:当前div继承的字体大小*1.5 但是当div进行嵌套的时候,em始终是按照当前div继承的字体大小来缩放,参照后面的例子. 2.rem 这里的r就是root的意思,意思是相对于根节点来进行缩放,当有嵌套关系的时候,嵌套…

案例效果: (1)导入所需的素材,然后用storyboard把上半截位置和大小相对固定的东西布局起来.当然,这些控件也要定义成对应地IBOutlet和IBAction方便兴许使用它们. 注意:本案例在3.5inch设备上显示最佳,所以须要设置一下. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd2Vpc3ViYW8=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/So…

方法一:设置fontsize 按照iphone 5的适配  1em=10px    适配320 // “()()”表示自执行函数 (function (doc, win) { var docEl = doc.documentElement, // 手机旋转事件,大部分手机浏览器都支持 onorientationchange 如果不支持,可以使用原始的 resize resizeEvt = 'orientationchange' in window ? 'orientationchange' :…

比如:目前我手中有一张psd图,大小为640*1010,适配苹果5的手机. 方法步骤: 1.我采用font-size=10px为640*1010手机的初始像素大小:  1rem=10px: 此时psd上有一个文字的大小为20px,即当前我的字体大小用rem表示为:font-size:1rem  (psd上的大小为html上大小的2倍,so首先要除以2才能得到正确的px,之后换算rem再次除以2就ok了) 适配各种手机的rem单位: 2.获取我当前使用手机的width:   var windowW…

前言 首先你要知道 vw 和 rem 是什么?怎么使用? ①:简单来说 vw 是视口单位,相当于把视口等分成了100,1vw = 1; ②:rem是相对单位,设置根元素 html 的 font-size,比如给 html 设置字体大小为100px,1rem = 100px; 注:我之前针对 vw 和 rem 分别写过一篇博客,详见如下 vw:https://www.cnblogs.com/tu-0718/p/9906692.html rem:https://www.cnblogs.com/tu-…

例子: INSERT VolunteerSound_Table (Title,ArticleContent)OUTPUT Inserted.ID VALUES ('FirstVal','bbbbb') 说明:Inserted.ID为返回的新ID OUTPUT是SQL SERVER2005的新特性.可以从数据修改语句中返回输出.可以看作是"返回结果的DML".INSERT,DELETE,UPDATE均支持OUTPUT子句.在OUTPUT子句中,可以引用特殊表inserted和delete…

是不是还在为html繁琐的标签写法而苦恼? 是不是还在枯燥的写尖括号? Zen Coding的到来将让前端编码不在繁琐.不再拘泥html的尖括号和一堆一堆的标签. 先看看ZenCoding的效果图. 几个单词+几个符号就能把成堆的html框架写好. 下面来看ZenCoding的用法. 先介绍ZenCoding的快捷键: Ctrl + E:展开代码 Ctrl + D:向外快速选中代码块 Shift + Ctrl + D:向内快速选中代码块 Shift + Ctrl + A:输入一个缩写,自动展开并…

别以为我在刷水题.... 今天做了场srm,500pt想到了是dp但是无从下手,但是看了rng_58的神代码后顿觉海阔天空啊(盯着看了一个下午),相比于一年前的写法,真的是不忍直视啊, TC真是个好地方...赞! 其实就是将普通的铺砖块问题用类似于插头dp逐格递推的思路来写.下面的代码相信大家应该都能看懂. #include <cstdio> #include <cstring> #include <algorithm> long long dp[2][1<<…

总是忘了一些条件的判断,比如非空或者其他之类. #include<iostream> using namespace std; int Frepeat(int num[],int length) { ) { ; } ;i <length ;i++) { || num[i]>= length) ; } //int n[] = new int[length -1]();// 这里显示类型不匹配 cannot convert from int * to int [] ](); ;i &l…