1 semana atrás · 1254519ac6
--- a/6.html5/10.本地存储.html
+++ b/6.html5/10.本地存储.html
@@ -9,7 +9,7 @@
 
				     
			
 
				     
			
 
				     <!-- 
			
 
				-        WebStoarge 和 Cookie 
			
 
				+        WebStorage 和 Cookie 
			
 
				         本地存储：localStorage：除非手动删除 否则不会消失
			
 
				         会话存储：SessionStorage：关闭页面就会消失
			
 
				     -->
			
--- a/7.移动端/4.解决1px问题.html
+++ b/7.移动端/4.解决1px问题.html
@@ -0,0 +1,16 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+<head>
			
 
				+    <meta charset="UTF-8">
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1/window.devicePixelRatio,user-scalable=no">
			
 
				+    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=1.0,maximum-scale=1.0,minimum-scale=1.0" >
			
 
				+    <title>Document</title>
			
 
				+</head>
			
 
				+<body>
			
 
				+    <!-- 
			
 
				+        1.视口：initial-scale
			
 
				+        2.transform:scale(0.5)
			
 
				+        3.meta
			
 
				+    -->
			
 
				+</body>
			
 
				+</html>
			
--- a/7.移动端/5.媒体查询.html
+++ b/7.移动端/5.媒体查询.html
@@ -0,0 +1,41 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+<head>
			
 
				+    <meta charset="UTF-8">
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
			
 
				+    <title>Document</title>
			
 
				+    <link rel="stylesheet" href="./style/xxxx" media="screen  and (min-width:375px) and (max-width:414px)">
			
 
				+    <style>
			
 
				+        #box {
			
 
				+            width: 2rem;
			
 
				+            height: 2rem;
			
 
				+            background: pink;
			
 
				+        }
			
 
				+        @media screen and (min-width:375px) and (max-width:414px) {
			
 
				+            #box {
			
 
				+                background: purple;
			
 
				+            }
			
 
				+        }
			
 
				+        @media screen and (min-width:768px){
			
 
				+            #box {
			
 
				+                background: red;
			
 
				+            }
			
 
				+        }
			
 
				+    </style>
			
 
				+</head>
			
 
				+<body>
			
 
				+    <div id="box"></div>
			
 
				+    <script src="./rem.js"></script>
			
 
				+    <!-- 
			
 
				+        媒体查询
			
 
				+        @media 设备 关键字 条件 {代码块}
			
 
				+        设备：
			
 
				+            screen:显示器 pc 手机
			
 
				+            all:所有设备
			
 
				+        关键字：
			
 
				+            and not only
			
 
				+        条件：
			
 
				+            min-xxx;max-xxx
			
 
				+    -->
			
 
				+</body>
			
 
				+</html>
			
--- a/7.移动端/images/1.jpg
+++ b/7.移动端/images/1.jpg
--- a/7.移动端/images/2.jpg
+++ b/7.移动端/images/2.jpg
--- a/7.移动端/images/3.jpg
+++ b/7.移动端/images/3.jpg
--- a/7.移动端/images/4.jpg
+++ b/7.移动端/images/4.jpg
--- a/7.移动端/images/card_vip1.png
+++ b/7.移动端/images/card_vip1.png
--- a/7.移动端/images/icon_kugou1.png
+++ b/7.移动端/images/icon_kugou1.png
--- a/7.移动端/images/icon_search_black.png
+++ b/7.移动端/images/icon_search_black.png
--- a/7.移动端/rem.js
+++ b/7.移动端/rem.js
@@ -1,9 +1,19 @@
 
				-(function(win){
			
 
				-    var docEl = win.document.documentElement;
			
 
				-    var width = docEl.getBoundingClientRect().width;
			
 
				-    console.log(width,'kuann');
			
 
				-    var rem = width / 7.5;
			
 
				-    console.log(rem,'rem');
			
 
				-    docEl.style.fontSize = rem + 'px';
			
 
				+(function (win) {
			
 
				+    var timer;
			
 
				+    function refreshRem() {
			
 
				+        var docEl = win.document.documentElement;
			
 
				+        var width = docEl.getBoundingClientRect().width;
			
 
				+        console.log(width, 'kuann');
			
 
				+        var rem = width / 7.5;
			
 
				+        console.log(rem, 'rem');
			
 
				+        docEl.style.fontSize = rem + 'px';
			
 
				+    }
			
 
				+    console.log("走进来")
			
 
				+    win.addEventListener('resize',function() {
			
 
				+        console.log("监听")
			
 
				+       clearTimeout(timer);
			
 
				+       timer =  setTimeout(refreshRem,10)
			
 
				+    },false);
			
 
				+    refreshRem()
			
 
				 
			
 
				 })(window);