1.首先查看ifconfig所在的命令包：yum search ifconfig。

2.安装该命令包：yum install net-tools.x86_64，安装过程中需要两次确认，直接输入y就行。

3.安装成功之后就可以使用ifconfig命令了。

• 在移动端浏览器会遇见点击出现高亮的效果，在某项项目是不需要这个默认的效果的。那么我们通常会把这个点击的颜色设置成透明。当然也可以设置成自己喜欢的颜色。
  -webkit-tap-highlight-color:transparent;/清除点击高亮效果/

• 通过css3的新属性box-sizing我们能够让盒子有限顾及自己的尺寸而不是内容,避免出现多余的滚动条。

  -webkit-box-sizing: border-box;/*webkit内核兼容性写法*/
  box-sizing: border-box;

• 在移动设备的浏览器中input标签一般会有默认的样式,通过border=none,outline=none无法去除,比如立体效果,3d效果等等,我们需要添加下列样式。
  -webkit-appearance: none;/*在移动端清除浏览器默认样式*/

• 考虑到移动设备在大尺寸的的屏幕不会过度缩放 失去清晰度,在小尺寸的屏幕中不会出现布局错乱的问题。

  max-width: 640px;  /*在行业当中的移动端的设计图一般使用的是640px*/
  min-width: 300px;  /*在移动设备当中现在最小的尺寸320px*/

• nth-child()如果有多个不同兄弟节点获取的时候,索引需要特殊计算,我们可以限定在某一个类型上,语法如下

  • E:first-of-type匹配同类型中的第一个元素E。
  • E:last-of-type匹配同类型中的最后一个元素E。
  • E:nth-of-type(n) 匹配同类型中的第n个元素E。

viewport 是用户网页的可视区域。如果把移动设备的浏览器(也有可能是app中的webview) ,当做相框的话，viewport就相当于相框中的画,可能会比相框小,可能会比相框大,最好是一样大。该属性最早是苹果公司在Safari中推出用来解决移动设备的viewport问题的.后来被各大安卓以及浏览器厂商效仿,所以说这个属性真的是非常有用的。
语法设置：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

标签值：

• width:设置layout viewport 的宽度，为一个正整数，或字符串"width-device"。
• initial-scale:设置页面的初始缩放值，为一个数字，可以带小数。
• minimum-scale:允许用户的最小缩放值，为一个数字，可以带小数。
• maximum-scale:允许用户的最大缩放值，为一个数字，可以带小数。
• height:设置layout viewport 的高度，这个属性对我们并不重要，很少使用。
• user-scalable:是否允许用户进行缩放，值为"no"或"yes", no 代表不允许，yes代表允许。

Emmet语法中，输入meta:vp,然后按tab键，会自动生成viewport的代码。

$.ajax({}) 方法

参数很多，可以通过手册来使用，在这里简单写一个小案例，说一下比较常用的参数。

$.ajax({
        url:'01.php',//请求地址
        data:'name=fox&age=18',//发送的数据
        type:'GET',//请求的方式
        success:function (argument) {},// 请求成功执行的方法
        beforeSend:function (argument) {},// 在发送请求之前调用,可以做一些验证之类的处理
        error:function (argument) {console.log(argument);},//请求失败调用
    })

$.get()方法

参数列表

注意：我们在向服务器提交数据时,如果使用的是Ajax需要手动将数据格式化name=fox&age=10类似这样的格式,JQuery已经帮助我封装好了一个格式化数据的方法$('form').serialize()

$.post()方法

参数列表:

Asynchronous Javascript And XML（异步JavaScript和XML）,他并不是凭空出现的新技术,而是对于现有技术的结合:核心是js对象XMLHttpRequest。
Ajax的使用一共分为5步
1.建立XMLHTTPRequest对象
2.注册回调函数

• 当服务器回应我们了,我们想要执行什么逻辑

3.使用open方法设置和服务器端交互的基本信息,即：设置提交的网址,数据,post提交的一些额外内容
设置发送的数据，开始和服务器端交互
4.发送数据
5.处理响应，在注册的回调函数中,获取返回的数据,处理返回回来的数据。

示例代码:GET

get的数据,直接在请求的url中添加即可

<script type="text/javascript">
    // 创建XMLHttpRequest 对象
    var xml = new XMLHttpRequest();
    // 设置跟服务端交互的信息
    xml.open('get','01.ajax.php?name=fox');
    xml.send(null);    // get请求这里写null即可
    // 接收服务器反馈
    xhr.onreadystatechange = function () {
        // 这步为判断服务器是否正确响应
        if (xhr.readyState == 4 && xhr.status == 200) {
            // 打印响应内容
            alert(xml.responseText);
        } 
    };
</script>

示例代码:POST

<script type="text/javascript">
    // 异步对象
    var xhr = new XMLHttpRequest();
    // 设置属性
    xhr.open('post', '02.post.php' );
    // 如果想要使用post提交数据,必须添加
    xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    // 将数据通过send方法传递
    xhr.send('name=fox&age=18');
    // 发送并接受返回值
    xhr.onreadystatechange = function () {
    // 这步为判断服务器是否正确响应
    if (xhr.readyState == 4 && xhr.status == 200) {
           alert(xhr.responseText);
        } 
    };
</script>

注意：
1.创建XMLHttpRequest对象(兼容性写法)
新版本浏览器:var xml=new XMLHttpRequest();
（IE5 和 IE6）:var xml=new ActiveXObject("Microsoft.XMLHTTP");
考虑兼容性创建Ajax对象

 var request ;
 if(XMLHttpRequest){
    // 新式浏览器写法
    request = new XMLHttpRequest();
 }else{
    //IE5,IE6写法
    new ActiveXObject("Microsoft.XMLHTTP");
 }

2.发送请求:

3.onreadystatechange事件

当服务器给予我们反馈时,我们需要实现一些逻辑

附录：封装的方法：

function ajax(option) {
  // 创建对象
  var xmlRequest ;
  if (XMLHttpRequest) {
      xmlRequest = new XMLHttpRequest();
  }else{
      xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");

  }

  // 格式化传入的数据为name=fox&age=18这样的格式
  var formatStr = "";
  for(var item in option.data){
      // 获取属性名,属性值,进行拼接
      formatStr+=item;// 属性名
      formatStr+="=";//等号
      formatStr+=option.data[item];//属性值
      formatStr+="&";//分隔符
  }

  // 去除最后一个&
  formatStr = formatStr.slice(0,-1);

  // open方法 如果是get方法,那么url之后需要添加数据
  if(option.method == "get"){
      option.url = option.url+"?"+formatStr;
      option.data = null;
  }
  // 调用open方法
  xmlRequest.open(option.method,option.url)

  // 如果是post设置HTTP协议头
  if (option.method=="post") {
      xmlRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
  }

  // send方法 这里的data已经是修改过的,如果使用的是get方法,那么data为null
      xmlRequest.send(option.data);

  // 判断状态改变,调用方法
  xmlRequest.onreadystatechange = function () {
  // 这步为判断服务器是否正确响应
  if (xhr.readyState == 4 && xhr.status == 200) {
             option.success(这里的数据是ajax获取的);  
     } 
  };
}

wphp中上传文件并保存的时候，在html表单中需要设置enctype="multipart/form-data"，并且只能post方式 PHP接收文件可以通过$_FILES来获取。文件上传到服务器之后就会生成一个临时文件.tmp。.tmp文件一会就被自动删除。服务器返回的内容中,有文件的名字以及上传文件保存的位置。如果让文件长期存储，我们将其移动到其他的位置即可。
html代码如下：

<form action='xx.php' method='post' enctype='multipart/form-data'>
    <input type='file' name='icon'>
    <input type='submit'>
</form>

服务器端代码：

<?php
// 可以打印 $_FILES的所有信息
print_r($_FILES);
move_uploaded_file($_FILES['photo']['tmp_name'], './images/test.jpg');
?>

注意：

• $_FILES用法跟$_GET,$_POST类似,都是关系型数组。
• #_FILE['key']:可以获取对应上传的文件,这里的key跟提交时的name相对应。
• #_FILE['key']['name'] 可以获取上传的文件名。
• #_FILE['key']['tmp_name']可以获取上传的文件保存的临时目录。

附录：move_uploaded_file(移动文件)
move_uploaded_file参数:
参数1:移动的文件
参数2:目标路径

php默认有上传文件大小的限制
我们只需要更改php.ini就可以修改基本配置

• 设置文件最大上传限制(值的大小可以根据需求修改)

  file_uploads = On   ; 是否允许上传文件 On/Off 默认是On
  upload_max_filesize = 32M       ; 上传文件的最大限制
  post_max_size = 32M             ; 通过Post提交的最多数据

• 考虑网络传输快慢,这里修改一些参数

  max_execution_time = 30000      ; 脚本最长的执行时间 单位为秒
  max_input_time = 600            ; 接收提交的数据的时间限制 单位为秒
  memory_limit = 1024M            ; 最大的内存消耗

在微信开发的过程中，由于用户的昵称用的是emoji表情，小编就吃了很大的一个亏，在给客户演示的时候发现的SQL错误，导致存入失败。经过一段时间的摸索，发现数据库是可以直接存储emoji表情。小编的解决方法如下：
1.mysql数据库的版本大于等于5.5.3
2.把数据库的编码改成utf8mb4，字符集校对改成utf8mb4_general_ci。
3.把要存储emoji表情的表或者字段也改成utf8mb4，字符集校对改成utf8mb4_general_ci。
4.数据库配置也要更改 'DB_CHARSET' => 'utf8mb4', // 数据库编码默认采用utf8。
5.重启数据库。

HTML5中我们可以轻松的构建一个离线（无网络状态）应用，只需要创建一个cache manifest文件。

优势
1、可配置需要缓存的资源
2、网络无连接应用仍可用
3、本地读取缓存资源，提升访问速度，增强用户体验
4、减少请求，缓解服务器负担

缓存清单
一个普通文本文件，其中列出了浏览器应缓存以供离线访问的资源，推荐使用.appcache为后缀名，添加MIME类型
AddType text/cache-manifest .appcache
例如我们创建了一个名为demo.appcache的文件，然后在需要应用缓存在页面的根元素(html)添加属性manifest="demo.appcache"，路径要保证正确。

manifest文件格式
1、顶行写CACHE MANIFEST
2、CACHE: 换行 指定我们需要缓存的静态资源，如.css、image、js等
3、NETWORK: 换行 指定需要在线访问的资源，可使用通配符
4、FALLBACK: 当前页面无法访问时退回的页面(回退;  后退)
换行 当被缓存的文件找不到时的备用资源 可自行查阅资料

其它

1、CACHE: 可以省略，这种情况下将需要缓存的资源写在CACHE MANIFEST
2、可以指定多个CACHE: NETWORK: FALLBACK:，无顺序限制

CACHE:需要缓存那些资源.
NETWORK:不需要缓存那些资源，必须在网络下面才能访问.
FALLBACK:当访问不到某个资源时，自动由另外一个资源替换.

CACHE MANIFEST

   CACHE:
   #此部分是需要缓存的资源

   NETWORK:
   #不需要缓存那些资源，必须在网络下面才能访问
    FALLBACK:
   #当前页面无法访问时退回的页面(回退;  后退)

3、#表示注释，只有当demo.appcache文件内容发生改变时或者手动清除缓存后，才会重新缓存。
4、chrome 可以通过chrome://appcache-internals/工具和离线（offline）模式来调试管理应用缓存

通过window.onLine来检测，用户当前的网络状况，返回一个布尔值
window.online用户网络连接时被调用
window.offline用户网络断开时被调用

window.addEventListener("online",function(){
         alert("已经建立了网络连接")
    })
window.addEventListener("offline",function(){
         alert("已经失去了网络连接")
})

HTML5规范允许用户自定义网页上任一元素全屏显示。
requestFullscreen() 开启全屏显示
cancleFullscreen() 关闭全屏显示
不同浏览器需要添加前缀如：

 webkitRequestFullScreen、mozRequestFullScreen
 webkitCancleFullScreen、mozCancleFullScreen

通过document.fullScreen检测当前是否处于全屏
不同浏览器需要添加前缀
document.webkitIsFullScreen、document.mozFullScreen
全屏伪类

:full-screen .box {}、:-webkit-full-screen {}、:moz-full-screen {}
var docElm = document.documentElement;
    if (docElm.requestFullscreen) {
       docElm.requestFullscreen();
    }
    else if (docElm.mozRequestFullScreen) {
       docElm.mozRequestFullScreen();
    }
    else if (docElm.webkitRequestFullScreen) {
       docElm.webkitRequestFullScreen();
    }