整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
以下HTML标记用于格式化网页上文本的外观。这可以使网页变得更加生动，但是，文本格式的太多变化也会使人不快。
head标记有6个级别可用，从h1用于最大和最重要的标题，到h6是最小的标题。
b标记之间的文本以粗体显示，与周围的文本相对突出。
i标记以一个小角度显示文本。
u标记在文本正文添加一条线，请注意，链接已经有下划线，不需要额外的标记。
strike标记在文本的正中间画一条线，通常用来表示文本是旧的，不再相关，删除。也可以用<s></s>代替。
pre标记之间的任何文本，包括空格、回车符和标点符号，都将像在文本编辑器中一样显示在浏览器中（通常浏览器会忽略多个空格）
code标记之间的文本以固定宽度字体显示，通常在显示源代码时使用。
tt标记之间的文本就像是用打字机打出了一个固定宽度的文字。
blockquote标记定义一个块引用，并且在块的左右添加额外的边距。
small标记让你无需设置字体大小，就可以使文本呈现比周围稍小的外观。
font标记的color属性改变几个字或一段文字的颜色。属性使用十六进制颜色代码。
font标记的size属性改变字体的大小，值范围从1到7，1是最小，7是最大。
font标记的size属性还可以相对于其前面的字体大小的作即时更改，此用法将按你指定的数字增减字体大小。例如：<font size="-1">一些文本</font>
font标记的face属性以指定的字体显示文本，值为字体名称，如“Helvetica”、“Arial”或“Courier”。
center标记之间的所有内容都居中。
em标记用于强调文本，文本通常以斜体显示，可能会根据浏览器的不同而有所不同。
strong标记用于着重强调文本，通常以粗体显示，可能会根据浏览器的不同而有所不同。
下面是以上标记的示例：
浏览器显示内容如下所示：
用方案
1、设置根 font-size：625%（或其它自定的值，但换算规则 1rem 不能小于 12px）
2、通过媒体查询分别设置每个屏幕的根 font-size
3、CSS 直接除以 2 再除以 100 即可换算为 rem
优：有一定适用性，换算也较为简单。
劣：有兼容性的坑，对不同手机适配不是非常精准；需要设置多个媒体查询来适应不同手机，单某款手机尺寸不在设置范围之内，会导致无法适配。
网易方案
1、拿到设计稿除以 100，得到宽度 rem 值
2、通过给 html 的 style 设置 font-size，把 1 里面得到的宽度 rem 值代入x document.documentElement.style.fontSize =document.documentElement.clientWidth / x + ‘px‘;
3、设计稿 px/100 即可换算为 rem
优：通过动态根 font-size 来做适配，基本无兼容性问题，适配较为精准，换算简便。
劣：无 viewport 缩放，且针对 iPhone 的 Retina 屏没有做适配，导致对一些手机的适配不是很到位。
手淘方案
1、拿到设计稿除以 10，得到 font-size 基准值
2、引入 flexible
3、不要设置 meta 的 viewport 缩放值
4、设计稿 px/ font-size 基准值，即可换算为 rem
优：通过动态根 font-size、viewpor、dpr 来做适配，无兼容性问题，适配精准。
劣：需要根据设计稿进行基准值换算，在不使用 sublime text 编辑器插件开发时，单位计算复杂。
一、 弹性布局(100%布局)的特点
顶部与底部的bar不管分辨率怎么变，它的⾼度和位置都不变; 中间每条招聘信息不管分辨率怎么变，招聘公司的图标等信息 都位于条目的左边，薪资都位于右边.
特点：关键元素高宽和位置都不变，只有容器元素在做伸缩变换。对于这类app，记住一个开发原则就好：文字流式，控件弹性，图片等比缩放
二、什么是屏幕尺寸?
移动端屏幕尺寸:屏幕对角线的长度，单位是英寸(1英寸=2.54厘米)。
常见的尺寸有：2.4，2.8，3.5，3.7，4.2，5.0，5.5，6.0
三、什么是屏幕分辨率?
屏幕分辨率：指横纵方向上的像素点数，单位为px,1px=1个像素点。
一般以纵向像素*横向像素表示 一个手机的屏幕分辨率。如：1960*1080
这里的一个像素是指物理设备的一个像素点。
四、什么是屏幕像素密度?
屏幕像素密度：屏幕上每英寸可以显示像素点的数量，单位是ppi(pixels per inch)缩写。
屏幕像素密度与屏幕尺寸，屏幕分辨率有关，在单一条件下，屏幕尺寸越小，分辨率越高，像素密度越大，反之越小。
iphone3GS和iphone4区别：屏幕尺寸一样，屏幕分辨率相差一倍，屏幕像素密度也相差一倍。
PX:像素，将显示器分成非常细小的方格，每一个方格就是1px。
注:(网页重构中使用的px 和屏幕分辨率的px不一定是一样的大小)。
实际上像素分为两种：设备像素和逻辑像素( CSS像素)
DPR：设备像素比DPR(devicePixelRatio)是默认缩放为100%的情况下，设备像素和CSS像素的比值
在早先的移动设备中，并没有DPR的概念。随着技术的发展，移动设备的屏幕像素密度越来越高。从iphone4开始苹果公司推出了所谓的retina视网膜屏幕。之所以叫做视网膜屏幕，是因为屏幕的PPI(屏幕像素密度)太高，人的视网膜无法分辨出屏幕上的像素点。iphone4的分辨率提高了一倍，但屏幕尺寸却没有变化，这意味着同样大小的屏幕上，像素多了一倍，于是DPR = 2
五、等比缩放布局(rem布局)
1.rem是什么?
rem(font size of the root element)是指相对于根元素的字体大小的单位。
2.为什么web app要使用rem?
实现强大的屏幕适配布局(淘宝,腾讯,网易等网站都是rem布局适配)rem能等比例适配所有屏幕,根据变化html的字体大小来控制rem的大小,
六、vw vh
vw：viewpoint width，视窗宽度，1vw等于视窗宽度的1%。
vh：viewpoint height，视窗高度，1vh等于视窗高度的1%。
vmin：vw和vh中较小的那个。
vmax：vw和vh中较大的那个。
vw, vh, vmin, vmax：IE9+局部支持，chrome/firefox/safari/opera支持，iOS safari 8+支持，Android browser4.4+支持，chrome for android39支持
七、Rem配合VW做等比缩放布局
1.rem
rem是指相对于根元素的字体大小的单位。
2.根元素
如果根元素是相对设备尺寸自动变换。
3.VW
视窗宽度，1vw等于视窗宽度的1%。
4.VW转换成PX赋值给font-size
例：设备的分辨率为640*1136，逻辑像素为320*568 1VW=3.2px
Font-size:100px;转换成VW font-size:31.25vw;
1rem=31.25vw可一起结合写等比例缩放布局。
八、100%布局(弹性布局)
实现方案：采用PX方式，借助弹性盒实现。
九、等比例缩放布局(rem布局)
1.html{font-size:31.25vw(可变:设计稿);}
31.25vw=100px(50px或100px为基准单位(好算))/3.2px
3.2px=320(视口宽度)/100(1vw等于视窗宽度的1%。)
元素大小(rem)=原图量尺寸/dpr/100(50px、100px为基准单位(好算))
2，用媒体查询设置html的font-size配合rem(设置判断条件的节点)
3, 通过JS动态设置html的font-size同样元素单位也要配合rem实现等比例缩放布局。
*请认真填写需求信息，我们会在24小时内与您取得联系。
