分类：前端

前端框架:jquery,react,angular,vue
UI框架/UI库:
| | |
| ———— | ———— |
| | |
| | |
css框架:

npm install 或者 npm start 一直卡住
国外镜像就是不行，我试了n多方法，用vpn，命令行代理设置，都不行，最后换淘宝镜像，立马能用。

npm config set registry https://registry.npm.taobao.org
1
– 配置后可通过下面方式来验证是否成功

npm config get registry
1
2
然后 npm install

表单提交方法有三种，主要说下第三种
第一种：用 form 自带属性action 提交
第二种：用 jquery 提交：$(“#formid”).submit();
第三种：用 ajax 提交：
但如果form表单中数据很多时，不可能一一列出，只需要用
$(‘#yourformid’).serialize()就可以了
举例如下：

$.ajax({
cache: true,
type: “POST”,
url: ajaxCallUrl,
data: $(‘#yourformid’).serialize(),// 你的formid
async: false,
error: function(request) {
alert(“Connection error”);
},
success: function(data) {
$(“#commonLayout_appcreshi”).parent().html(data);\
}
});

第四种,H5新对象FormData

$(“#feeds”).load(“feeds.php”, {limit: 25}, function(){
alert(“The last 25 entries in the feed have been loaded”);
});

这样可以在后台管理系统中,左侧菜单栏可以这样异步加载,右边是iframe即可.

1. return {
   init:init
   };//返回对象,第一个init是对象名(普通字符串),第二个init是值(由具体的上下文参数决定内容)

2. 闭包的写法:(function(){})();
   实际上是这样的匿名简写:function a (){}; a;

3. prototype可以向对象添加属性和方法;
   var obj=new object();
   obj.prototype.newname=123;
   console.log(obj.newname)://123

1. 安装与破解:破解与语言包设置
2. 设置:教程
   a. 新建设置(Ctrl+N):web,1920,像素,72ppi,RGB8位,透明色
   b. 移动工具设置(V):Ctrl按住不动,自动选择选项
   c. 视图设置:视图菜单,显示智能参考线与标尺;窗口菜单,只选择图层,历史记录,信息,字符;信息设置RGB,像素,文档尺寸;首选项单位与标尺设置单位为像素;窗口菜单保存当前设置为web-切图工作区.
3. 传统切图教程
   使用参考线,
4. 切图扩展：一键切图，方便Cutterman

1.包含三个文件夹 css、fonts、js。
2.https://www.shiyanlou.com/courses/50/labs/222/document
3.viewpoint的meta标签,可通过js来修改viewpoint后面的值
http://www.w3cplus.com/mobile/lib-flexible-for-html5-layout.html
“`javascript

3.手机独立像素是相对的,在安卓中规定,160dpi下,1dp=1px;在320dpi时,1dp=2px;
  在软件中直接使用dp作为单位,在web中的css样式中px指的是css像素(也是一种虚拟像素),在物理端显示的时候会根据不同的分辨率对应不同的物理像素,1px=2pixels,前一个px指css像素,后2个px指物理像素;
  物理像素:设备的实际上的一个像素点;
  独立像素:设备中规定的一个虚拟像素,比如一个独立像素对应两个物理像素,使用时使用有独立像素,显示时自动转换.
  css像素:web中使用,也是一种虚拟像素,在设备中会实际转换成物理像素.
http://www.cnblogs.com/chengkun101/p/5461500.html
http://www.cnblogs.com/yaozhongxiao/archive/2014/07/14/3842908.html
  http://blog.csdn.net/u014623470/article/details/49784573
  http://www.w3cplus.com/mobile/lib-flexible-for-html5-layout.html
 ppi计算方式:
    勾股定理算出对角线的分辨率：√(1920²+1080²)≈2203px
    对角线分辨率除以屏幕尺寸：2203/5≈440dpi。
4.利用@media实现自适应排版:
```css
@media screen and (max-width: 600px) {  /*当屏幕尺寸小于600px时，应用下面的CSS样式*/
  .test {
    background: blue;
  }
}

5.删格布局:http://v3.bootcss.com/css/#grid
6.图标:http://v3.bootcss.com/components/,复制类名就能使用
7.bootstrap组件,尽量使用它提供的html结构.
8.也有很多插件,比如弹出,警告.

1. 派生选择器：通过上下文来确定元素的选择器：.nav h1{}
2. 盒子模型的四个组成：margin(外边距);border(边框);padding(内边距);content(内容)
3. CSS 有三种基本的定位机制：
   普通流:
   元素按照其在 HTML 中的位置顺序决定排布的过程
   浮动:
   浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。普通流元素视它为与文档无关，但其他浮动流认为有关。
   绝对定位:
   绝对定位使元素的位置与文档流无关，因此不占据空间。这一点与相对定位不同，相对定位实际上被看作普通流定位模型的一部分，因为元素的位置相对于它在普通流中的位置。

4. 相对位置:指相对于当前元素默认时的位置,然后使用top,right,bottom,left偏移

5. 圣杯布局:http://www.jianshu.com/p/f9bcddb0e8b4
6. 内联元素通过:display:block转换块元素,
   块元素通过:display:inline转换内联元素.
   “`javascript
   block元素的特点是：
   总是在新行上开始；
   高度，行高以及顶和底边距都可控制；
   宽度缺省是它的容器的100%，除非设定一个宽度</li>
   </ol>

   <p><

   div>,

   ,

   <

   h1>,

   <

   form>,

   <

   ul>和<li>是块元素的例子。
   inline元素的特点是：
   和其他元素都在一行上；
   高，行高及顶和底边距不可改变；
   宽度就是它的文字或图片的宽度，不可改变。
   <span>, <a>, <label>, <input>, <img>, <strong>和<em>是inline元素的例子。
   “`
   7. h1:36px;h2:30px;h3:24px;h4:18px;h5:14px;h2:12px;
   small元素标签显示小标题

1. HTML5 中的一些有趣的新特性：
   用于绘画的 canvas 元素
   用于媒介回放的 video 和 audio 元素
   对本地离线存储的更好的支持
   新的特殊内容元素，比如 article、footer、header、nav、section
   新的表单控件，比如 calendar、date、time、email、url、search
2. 使用canvas：
   var c=document.getElementById(“myCanvas”);
   var ctx=c.getContext(“2d”);