2017年11月_picoasis

原创 chrome中使用rem做单位，宽高计算数值不可用

下面三图为chrome的计算结果：代码设置：html{font-size:62.5%;}可以发现同样为1.6rem，字体大小正常计算得到16px，而padding-right不是16px.搜索得到的解答：原因是chrome的最小计算单位是12px;当小于12px时，会被当作12px进行计算。示例1html{font-size:10px;}

2017-11-19 21:32:34 2577

转载 chrome中ul的padding-left: 40px

ul的padding-left：40px使用 * {margin:0; padding:0;} ，或者用这个body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, table, th, td {margin:

2017-11-14 21:53:28 520

转载 Flex布局display：(-webkit-)flex;

基本概念：容器参数/项目参数/容器属性/项目属性。实现布局:骰子布局/网格布局/均匀布局/百分比布局/圣杯布局HolyGrail/输入框布局/悬挂式布局/固定底栏布局/流式布局。转载链接：Flex 布局教程：语法篇转载链接：Flex 布局教程：实例篇基本概念Flex容器：设置为Flex布局的元

2017-11-14 11:11:41 1455

原创区分：subString/ substr / slice / splice

String 对象的方法 slice()、substring() 和 substr()都可返回字符串的指定部分。Array对象的操作方法slice()，splice()。

2017-11-14 10:46:11 227

转载 iframe加载方案及性能

普通方法加载iframe/在onload之后加载iframe/setTimeout来加载iframe/友好型iframe加载。我们会经常使用iframes来加载第三方的内容、广告或者插件。使用iframe是因为它可以和主页面并行加载，不会阻塞主页面。

2017-11-09 17:34:03 7834

转载基于HTML5的可预览多图片Ajax上传

HTML5是个好东东，其中之一就是支持多图片上传，而且支持ajax上传，而且支持上传之前图片的预览，而且支持图片拖拽上传，纯粹利用file控件实现，JS代码寥寥，想不让人称赞都难啊！

2017-11-08 21:55:39 591

转载移动端应该如何动态设置字体大小？

利用js计算当前设备的DPR，动态设置在html标签上，并动态设置html的font-size，利用css的选择器根据DPR来设置不同DPR下的字体大小（这个方法很不错哦~）

2017-11-08 11:05:31 3834

转载移动端开发总结（一）视口viewport总结

转载链接：移动端开发中，关于适配问题的一点总结(一)视口布局视口layout viewport视觉视口visual viewport理想视口缩放一个重大区别最小缩放和最大缩放分辨率物理分辨率dpi设备像素比 dprdipsdevice-independent pixelsmeta视口完美的meta 视口

2017-11-07 23:06:51 3121

原创 name="viewport" width="device-width" 到底都是啥

移动端页面渲染过程，viewport，DPR，PPI

2017-11-07 22:16:52 37642

原创布局（一）float/absolute/relative的原理

floatabsolute

2017-11-03 21:58:34 388

转载 translate(-50%,-50%)实现居中

转载链接：http://www.imooc.com/qadetail/129282<body><div>这是用来测试的</div></body>/*CSS*/div{position:absolute;top:50%;left:50%; /*如果把这几行删掉，不可以居中 */border-radius: 5px;-webkit-transform:trans

2017-11-03 20:28:54 15931 3

原创 body{width:100%}但窗口出现滚动条&body的子元素height：100%实际高度未填满整个页面

width/height百分比设置参考链接1：width=100%时会出现滚动条的情况参考链接2：html,body设置高度100%和默认的滚动条问题一：body{width:100%}但窗口出现滚动条代码:<!doctype html><html><head><meta charset="utf-8"/><title>body{width":100%;}窗口有滚动条</title><

2017-11-02 17:12:08 13417

转载区别：innerHTML---innerText---createTextNode--document.write

innerHTML---innerText---createTextNode--document.write

2017-11-01 16:14:00 306

转载 a标签中href=""的几种用法

a标签的最重要功能是实现超链接和锚点。

2017-11-01 15:35:26 2832

原创问题：aUl.getElementsByTagName("li")错误“Uncaught ReferenceError: getElementsByTagName is not defined”

element.getElementsByTagName()方法的操作对象是一个确定唯一的元素，一个页面具体元素对象，不允许是数组。

2017-11-01 11:03:13 2449

lamanchas的博客