rem | 易学教程

rem适配布局

阅读更多关于 rem适配布局

rem适配布局 rem基础 rem是一个单位 rem（root em）是一个相对单位，类似于em，em是父元素字体大小不同的是rem的基准是相对于html元素的字体大小比如，根元素（html）设置font-size=12px；非根元素设置width:2rem;则换成px表示就是24px； rem的优点就是可以通过检测媒体查询来修改html里面的文字大小来改变元素的大小媒体查询媒体查询（Media Query）是CSS3新语法。 1.使用@media查询，可以针对不同的媒体类型定义不同的样式 2.@media可以针对不同的屏幕尺寸设置不同的样式 3.当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面 4.目前针对很多苹果手机、Android手机，平板等设备都用得到多媒体查询语法规范 @media mediatype and not|only (media feature){ CSS-Code; } 1.用@media开头注意@符号 2.mediatype媒体类型将不同的终端设备划分成不同的类型，称为媒体类型 all 用于所有设备 print 用于打印机和打印预览 screen 用于电脑屏幕，平板电脑，只能手机等 3.关键字and not only 关键字将媒体类型或多个媒体特性链接到一起作为媒体查询的条件 1.and：可以将多个媒体特性连接到一起

ddd

阅读更多关于 ddd

@echo off set regpath=HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Session Manager\Environment set basepath=%~dp0 echo 当前路径 %basepath% set javahome=%basepath%jdk1.8.0_131 echo javahome %javahome% set javalib=%basepath%lib echo javalib %javalib% rem LPY echo. echo ************************************************************ echo * * echo * JDK 系统环境变量设置 * echo * * echo ************************************************************ echo. echo === 准备设置环境变量: JAVA_HOME=%javahome% echo === 注意: 如果JAVA_HOME存在,会被覆盖,此操作不可逆的,请仔细检查确认!! === echo. echo === 准备设置环境变量: classPath=%%JAVA_HOME%%\lib\tools.jar

web前端入门到实战：CSS尺寸单位介绍

阅读更多关于 web前端入门到实战：CSS尺寸单位介绍

前端开发过程中，尺寸单位是我们必须用到的，下面我们对css中常见的几种尺寸单位px,em,rem,rpx进行逐一介绍在这之前，需要先对几个概念进行普及介绍基本概念（以下概念读起来可能有些晦涩，如果看不懂也没关系）像素它不是自然界的物理长度，指基本原色素及其灰度的基本编码。 css中的像素只是一个抽象的单位，在不同的设备或不同的环境中，css中的1px所代表的设备物理像素是不同的。在为桌面浏览器设计的网页中，我们无需对这个津津计较，但在移动设备上，必须弄明白这点。在早先的移动设备中，屏幕像素密度都比较低，如iphone3，它的分辨率为320x480，在iphone3上，一个css像素确实是等于一个屏幕物理像素的。后来随着技术的发展，移动设备的屏幕像素密度越来越高，从iphone4开始，苹果公司便推出了所谓的Retina屏，分辨率提高了一倍，变成640x960，但屏幕尺寸却没变化，这就意味着同样大小的屏幕上，像素却多了一倍，这时，一个css像素是等于两个物理像素的。其他品牌的移动设备也是这个道理。物理像素它是显示器（电脑、手机屏幕）最小的物理显示单位，物理像素指的是显示器上最小的点。物理像素的大小取决于屏幕。是一个无法改变的属性。设备独立像素我上一张图，你就会理解什么是设备独立像素就是我们开发过程中使用的css中的px 设备像素比（device pixel

px、em、rem三者之间的区别

阅读更多关于 px、em、rem三者之间的区别

px、em、rem都是计量单位，都能表示尺寸，但是有有所不同，而且其各有各的优缺点。 Px表示“绝对尺寸”（并非真正的绝对），实际上就是css中定义的像素（此像素与设备的物理像素有一定的区别，后续详细说明见文末说明1），利用px设置字体大小及元素宽高等比较稳定和精确。Px的缺点是其不能适应浏览器缩放时产生的变化，因此一般不用于响应式网站。 em表示相对尺寸，其相对于当前对象内文本的font-size（如果当前对象内文本的font-size计量单位也是em，则当前对象内文本的font-size的参考对象为父元素文本font-size）。使用em可以较好的相应设备屏幕尺寸的变化，但是在进行元素设置时都需要知道父元素文本的font-size及当前对象内文本的font-size，如有遗漏可能会导致错误。 rem也表示相对尺寸，其参考对象为根元素<html>的font-size，因此只需要确定这一个font-size。来源： https://www.cnblogs.com/shenyzby/p/11383705.html

移动端页面开发流程

阅读更多关于移动端页面开发流程

移动端页面布局一、移动端app分类 1、Native App原生app手机应用程序　　使用原生的语言开发的手机应用，Android系统用的是java，ios系统用的是object-C 2、Hybrid App 混合型app手机应用程序　　混合使用原生的程序和html5页面开发的手机应用 3、Web App 基于Web的app手机应用程序　　完全使用html5页面加前端js框架开发的手机应用二、Viewport视口　　视口是移动设备上用来显示网页的区域，一般会比移动设备可视区域大，宽度可能是980px或者1024px，目的是为了显示下整个为PC端设计的网页，这样带来的后果是移动端会出现横向滚动条，为了避免这种情况，移动端会将视口缩放到移动端窗口的大小。这样会让网页不容易观看，可以用meta标签，name="viewport"来设置视口的大小，将视口的大小设置为和移动设备可视区一样的大小。　　在移动端用来承载网页的这个区域，就是我们的视觉窗口，viewport（视口），这个区域可以设置高度宽度，可以按比例放大缩小，而且能设置是否允许用户自行缩放。参数说明： width：宽度设置的是viewport宽度，可以设置device-width特殊值initial-scale：初始缩放比，大于0的数字maximum-scale：最大缩放比minimum-scale

BAT脚本编写常用技巧

阅读更多关于 BAT脚本编写常用技巧

在平常开发中，经常会碰到使用定时任务按时跑批数据，或者其他定时操作的任务。下面就汇总整理BAT脚本编写常用的技巧：第一：使用BAT命令替换文件中的字符串 @echo 修改ctl控制文件内容Insert为append 表名改为FP_FPXX @echo off&setlocal enabledelayedexpansion @rem 读取CB_FDKFPCGL_MX_sqlldr.ctl所有内容 for /f "eol=* tokens=*" %%i in (CB_FDKFPCGL_MX_sqlldr.ctl) do ( @rem 设置变量a为每行内容 set a=%%i @rem 如果该行有INSERT，则将其改为APPEND set "a=!a:INSERT=APPEND!" @rem 把修改后的全部行存入$ echo !a!>>$) @rem 用$的内容替换原来a.txt内容 move $ CB_FDKFPCGL_MX_sqlldr.ctl 第二：使用BAT命令操作数据SQL文件一共分为两个部分：一个为bat批处理文件，用于sys用户连接数据库，并用来操作数据库，这里用来导入数据；另一个为sql文件，里面存储要执行的sql语句，这里用来删除、创建用户。一、为了方便，先看sql文件：ReCreateUser.sql -- 删除用户，如果没有该用户，第一次会报错 drop

移动web开发适配秘籍Rem（推荐）

阅读更多关于移动web开发适配秘籍Rem（推荐）

课程地址： https://www.imooc.com/learn/942 更新到4.1 动态获取视窗高度动态修改高清屏，0.5 （1）安装 npm install node-sass （2）编辑scss文件，运行生成css文件 node-sass a.scss b.css 利用sass和rem做单位转换计算： &相当于父元素减除margin重叠页面出现横向滚动条增加inner相对定位设置背景颜色示例完毕来源： oschina 链接： https://my.oschina.net/u/3018050/blog/1648814

面试碰到的部分问题

阅读更多关于面试碰到的部分问题

1.em、rem、px的区别 https://www.runoob.com/w3cnote/px-em-rem-different.html 1、概念 px：绝对单位，页面按精确像素展示。 em：相对单位，基准点为父节点字体的大小，如果自身定义了font-size按自身来计算（浏览器默认字体是16px），整个页面内1em不是一个固定的值。 rem：相对单位，可理解为”root em”, 相对根节点html的字体大小来计算，CSS3新加属性，chrome/firefox/IE9+支持。 2、特点 PX特点： 1. IE无法调整那些使用px作为单位的字体大小； 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位； 3. Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)。 EM特点： 1. em的值并不是固定的； 2. em会继承父级元素的字体大小。 rem特点： rem是CSS3新增的一个相对单位（root em，根em），这个单位引起了广泛关注。区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。目前，除了IE8及更早版本外

移动端rem加载时页面字体先放大再缩小

阅读更多关于移动端rem加载时页面字体先放大再缩小

先给body 设置visibility：hidden； <body id="body" style="visibility: hidden;"> </body> 然后需要在body下将body的样式设置为visibility：visible； <script> document.getElementById('body').style.visibility = "visible"; </script> 这样页面加载完body后先将body隐藏，等待rem js加载完，然后将body显示出来，简单粗暴；转载地址： https://blog.csdn.net/csl125/article/details/80548056 来源： https://blog.csdn.net/Bright2017/article/details/99582412

rem布局

阅读更多关于 rem布局

rem布局技术选型方案：采取单独制作移动页面方案技术：布局采取rem适配布局（less-rem+媒体查询）设计图纸：750px尺寸相关文件夹结构设置视口标签以及引入初始化央视 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximun-scale=1.0,minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="css/normalize.css"> 设置公共的common.less文件设置好最常见的屏幕尺寸，利用媒体查询设置不同的html字体大小，因为除了首页其他页面也需要常用尺寸：320px\360px\375px\384px\400px\414px\424px\480px\540px\720px\750px 划分的分数我们定位15等分 html字体大小为50px，写在最上面方案1 less 媒体查询 rem 方案2 flexible.js 手机淘宝团队出的简洁高效的移动端适配库不在需要些不同屏幕的媒体查询原理是把当前设备划分为10等分，但是不同设备下，比例还是一致的我们要做的

订阅 rem