摘要：
1 <!-- 事件委托就是利用事件冒泡的原理，把事件加到父级上，通过判断事件的来源的子集，执行相应的操作，事件委托首先可以极大的减少事件绑定的次数，提高性能；其次可以让新加入的子元素也可以拥有相同的操作。 --> 2 3 <!DOCTYPE html> 4 <html lang="en"> 5 <h 阅读全文
posted @ 2020-03-14 19:48
kog_maw
阅读(114)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:47
kog_maw
阅读(108)
评论(0)
推荐(0)
摘要：
1 <!-- 什么是事件冒泡：在一个对象触发某类事件（比如单击onclick事件），如果此对象定义了此事件的处理程序，那么次事件就会调用这个处理程序，如果没有定义次事件的处理程序或者事件返回true，那么这个事件就会向这个对象的父级对象传播，从里到外，直至它被处理（父级对象所有同类事件都将被激活）， 阅读全文
posted @ 2020-03-14 19:46
kog_maw
阅读(132)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:45
kog_maw
阅读(211)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:44
kog_maw
阅读(87)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:43
kog_maw
阅读(205)
评论(0)
推荐(0)
摘要：
1 <!-- 事件函数列表： 2 blur() 元素失去焦点 3 focus() 元素获得焦点 4 click() 鼠标单击 5 mouseover() 鼠标进去（进入子元素也触发） 6 mouseout() 鼠标离开（离开子元素也触发） 7 mouseenter() 鼠标进入（进入子元素不触发） 阅读全文
posted @ 2020-03-14 19:42
kog_maw
阅读(112)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:41
kog_maw
阅读(95)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:39
kog_maw
阅读(85)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 body{ 8 margin: 0; 9 } 10 阅读全文
posted @ 2020-03-14 19:37
kog_maw
阅读(128)
评论(0)
推荐(0)
摘要：
1 <!-- 获得页面滚动距离 2 $(document).scrollTop(); 文档高度超过窗口可视高度，继续下拉，就会有部分文档超过可视窗口的高度，这即是scrollTop 3 $(document).scrollLeft(); 4 5 页面滚动事件 6 $(window).scroll(f 阅读全文
posted @ 2020-03-14 19:36
kog_maw
阅读(396)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:35
kog_maw
阅读(181)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:34
kog_maw
阅读(153)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:33
kog_maw
阅读(142)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:32
kog_maw
阅读(136)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .btns input{ 8 height: 40 阅读全文
posted @ 2020-03-14 19:31
kog_maw
阅读(104)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 19:30
kog_maw
阅读(117)
评论(0)
推荐(0)
摘要：
1 <!-- fadeIn() 淡入 2 fadeOut() 淡出 3 fadeToggle() 切换淡入淡出 4 5 hide() 隐藏元素 6 show() 显示元素 7 toggle() 切换元素的可见状态 8 9 slideDown() 向下展开 10 slideUp() 向上卷起 11 s 阅读全文
posted @ 2020-03-14 17:35
kog_maw
阅读(125)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .btns input{ 8 height: 40 阅读全文
posted @ 2020-03-14 17:34
kog_maw
阅读(225)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .btns input{ 8 height: 40 阅读全文
posted @ 2020-03-14 17:33
kog_maw
阅读(170)
评论(0)
推荐(0)
摘要：
1 <!-- 有时候需要获得匹配元素相对于其同胞元素的索引位置，此时可以用index()方法获取 --> 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <title>Document</title> 阅读全文
posted @ 2020-03-14 17:32
kog_maw
阅读(293)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 17:31
kog_maw
阅读(232)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 17:29
kog_maw
阅读(950)
评论(0)
推荐(0)
摘要：
1 <!-- $('#div1').addClass('divClass2') 为id为div1的对象追加（不是替换）样式divClass2 2 $('#div1').removeClass('divClass2') 移除divClass样式 3 $('#div1').removeClass('di 阅读全文
posted @ 2020-03-14 17:28
kog_maw
阅读(194)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript" src="../jquery-1.12. 阅读全文
posted @ 2020-03-14 17:27
kog_maw
阅读(199)
评论(0)
推荐(0)
摘要：
1 <!-- 对选择集进行过滤 2 $('div').has('p'); 选择包含p元素的div元素 3 $('div').not('.myClass'); 选择class不等于myClass的div元素 4 $('div').filter('.myClass'); 选择class等于myClass 阅读全文
posted @ 2020-03-14 17:26
kog_maw
阅读(252)
评论(0)
推荐(0)
摘要：
1 <!-- jQuery选择器可以快速的选择元素，选择规则和css样式相同，使用length属性判断是否选择成功： 2 $('#myid') 选择ID为myid的网页元素 3 $('.myClass') 选择class为myClass的元素 4 $('li') 选择所有的li元素 5 $('#ul 阅读全文
posted @ 2020-03-14 17:25
kog_maw
阅读(152)
评论(0)
推荐(0)
摘要：
1 <!-- jQuery用法思想一、选择器：选择某个网页元素，然后对其进行某种操作 2 用法思想二、样式操作：同一个函数完成赋值和取值 3 4 jQuery是目前使用最广泛的JavaScript函数库。据统计，全世界排名前100的网站，有46%使用jQuery，远超其他库。 5 微软甚至把jQue 阅读全文
posted @ 2020-03-14 17:24
kog_maw
阅读(172)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 div{ 8 margin: 50px auto 阅读全文
posted @ 2020-03-14 17:22
kog_maw
阅读(451)
评论(0)
推荐(0)
摘要：
1 <!-- math.random 获取0-1的随机数 2 math.floor 向下取整 3 math.ceil 向上取整 --> 4 <!DOCTYPE html> 5 <html lang="en"> 6 <head> 7 <meta charset="UTF-8"> 8 <title>Do 阅读全文
posted @ 2020-03-14 17:21
kog_maw
阅读(153)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 17:20
kog_maw
阅读(155)
评论(0)
推荐(0)
摘要：
1 <!-- window.location.href 获取或者重定url地址 2 window.location.search 获取地址参数部分 3 window.location.hasd 获取页面锚点或者叫哈希值 --> 4 <!DOCTYPE html> 5 <html lang="en"> 阅读全文
posted @ 2020-03-14 17:19
kog_maw
阅读(152)
评论(0)
推荐(0)
摘要：
1 <!-- 封闭函数的功能：为了解决变量覆盖问题，特别是进行功能迭代的时候，可以用封闭函数，避免前后命名冲突导致的bug --> 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <title>Docu 阅读全文
posted @ 2020-03-14 17:18
kog_maw
阅读(148)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 17:17
kog_maw
阅读(135)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 17:16
kog_maw
阅读(103)
评论(0)
推荐(0)
摘要：
1 <!-- 变量作用域：是指变量作用的范围，JavaScript中的变量分为全局变量和局部变量。 2 1、全局变量：在函数之外定义的变量，为整个页面公用，函数内外部都可以访问。 3 1、局部变量：在函数内部定义的变量，只能在定义该变量的函数内部访问，外部无法访问。 --> 4 5 <!DOCTYP 阅读全文
posted @ 2020-03-14 17:15
kog_maw
阅读(107)
评论(0)
推荐(0)
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> *{ margin: 0; padding: 0; } .list_con{ 阅读全文
posted @ 2020-03-14 17:14
kog_maw
阅读(94)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>定时器动画</title> 6 <script type="text/javascript"> 7 window.onload = func 阅读全文
posted @ 2020-03-14 17:13
kog_maw
阅读(337)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>定时器动画</title> 6 <script type="text/javascript"> 7 window.onload = func 阅读全文
posted @ 2020-03-14 17:12
kog_maw
阅读(132)
评论(0)
推荐(0)
摘要：
1 <!-- 定时器属于BOM浏览器对象模型是操作浏览器的一些方法，在JavaScript中的作用： 2 1、制作动画 3 2、异步操作 4 3、函数缓冲和节流 5 两种定时器： 6 1、只执行一次的定时器 7 开启：setTimeout 关闭：clearTimeout 8 2、反复执行的定时器 9 阅读全文
posted @ 2020-03-14 17:11
kog_maw
阅读(118)
评论(0)
推荐(0)
摘要：
1 <!-- 利用数组的reverse() 将数组反转 2 split切割后生成的数数组，可以通过下标取出对应元素。 --> 3 <!DOCTYPE html> 4 <html lang="en"> 5 <head> 6 <meta charset="UTF-8"> 7 <title>Documen 阅读全文
posted @ 2020-03-14 17:10
kog_maw
阅读(120)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 var iNum = 12; 8 阅读全文
posted @ 2020-03-14 17:09
kog_maw
阅读(144)
评论(0)
推荐(0)
摘要：
<!-- 1、ECMAscript JavaScript的语法（变量、函数、循环语句等） 2、DOM 文档对象模型 操作HTML和css的方法 3、BOM 浏览器对象模型 操作浏览器的一些方法 --> 阅读全文
posted @ 2020-03-14 17:07
kog_maw
阅读(103)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 17:06
kog_maw
阅读(178)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 var aList01 = [1, 阅读全文
posted @ 2020-03-14 17:05
kog_maw
阅读(94)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 17:04
kog_maw
阅读(365)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 8 var aList = ['a 阅读全文
posted @ 2020-03-14 17:03
kog_maw
阅读(89)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 var aList = [[1,2 阅读全文
posted @ 2020-03-14 17:02
kog_maw
阅读(99)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <!-- 操作数组中数据的方法： 7 1.获取数组的长度：aList.length 8 2.用下标操作 阅读全文
posted @ 2020-03-14 17:01
kog_maw
阅读(125)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 17:00
kog_maw
阅读(171)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:59
kog_maw
阅读(134)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <!-- 条件运算符：==, ,>,<,>=,<=,!=,&&(而且),||(或者),!(否，取反) --> 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <title>Document</tit 阅读全文
posted @ 2020-03-14 16:57
kog_maw
阅读(103)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <!-- % 求余 0%任何数=0 3 a++ 等同于a += 1 4 --> 5 <html lang="en"> 6 <head> 7 <meta charset="UTF-8"> 8 <title>Document</title> 9 <script t 阅读全文
posted @ 2020-03-14 16:56
kog_maw
阅读(96)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:55
kog_maw
阅读(114)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <!-- return 同python中return效果一样 --> 3 <html lang="en"> 4 <head> 5 <meta charset="UTF-8"> 6 <title>Document</title> 7 <script type=" 阅读全文
posted @ 2020-03-14 16:53
kog_maw
阅读(110)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:52
kog_maw
阅读(88)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 8 // 变量和函数的声明会提前预 阅读全文
posted @ 2020-03-14 16:51
kog_maw
阅读(74)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <link rel="stylesheet" type="text/css" href="skin01 阅读全文
posted @ 2020-03-14 16:50
kog_maw
阅读(119)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:49
kog_maw
阅读(78)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:48
kog_maw
阅读(85)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 function fnChange 阅读全文
posted @ 2020-03-14 16:47
kog_maw
阅读(131)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:45
kog_maw
阅读(232)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:44
kog_maw
阅读(140)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = f 阅读全文
posted @ 2020-03-14 16:43
kog_maw
阅读(130)
评论(0)
推荐(0)
摘要：
1 <!-- 获取元素的方法一 2 可以使用内置对象document上的getElementByld方法来获取页面上设置了ID属性的元素，获取到的是一个html对象，然后将它赋值给一个变量 --> 3 4 <!DOCTYPE html> 5 <html lang="en"> 6 <head> 7 < 阅读全文
posted @ 2020-03-14 16:42
kog_maw
阅读(120)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 var iNum = 1; 8 v 阅读全文
posted @ 2020-03-14 16:41
kog_maw
阅读(143)
评论(0)
推荐(0)
摘要：
1 <!-- 1、行间事件（主要用于事件） 2 <input type="button" name="" onclick="alert('ok! ');""> 3 4 2、页面script标签嵌入 5 <script type="text/javascript">alret('ok!');</scr 阅读全文
posted @ 2020-03-14 16:40
kog_maw
阅读(237)
评论(0)
推荐(0)
摘要：
<!-- // JavaScript是运行在浏览器端的脚步语言，JavaScript主要解决的是前端和用户的交互问题，包括使用交互和数据交互。JavaScript是浏览器解释执行的，前端脚本语言还有JScript(微软，IE独有)，ActionScript(Adobe公司独有，需要插件等) // 前 阅读全文
posted @ 2020-03-14 16:39
kog_maw
阅读(97)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 </head> 7 <!-- 新增常用表单控件属性： 8 1、placeholder 设置文本框默认提 阅读全文
posted @ 2020-03-14 16:38
kog_maw
阅读(100)
评论(0)
推荐(0)
摘要：
1 <!-- 新增语义标签 2 1、<header>页面头部、页眉 3 2、<nav> 页面导航 4 3、<artice> 一篇文章 5 4、<aside> 侧边栏 6 5、<section> 文章中的章节 7 6、<footer> 页面底部、页脚 8 音频视频 9 1、<audio> 10 2、< 阅读全文
posted @ 2020-03-14 16:37
kog_maw
阅读(87)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en" style="font-size: 20px"> 3 <!-- style="font-size: 20px" 设置1rem单位为20px --> 4 <head> 5 <meta charset="UTF-8" > 6 <me 阅读全文
posted @ 2020-03-14 16:35
kog_maw
阅读(94)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, user-scalable=no, initial- 阅读全文
posted @ 2020-03-14 16:33
kog_maw
阅读(134)
评论(0)
推荐(0)
摘要：
<!-- 响应式布局： 响应式布局就是使用媒体查询的方式，通过查询浏览器的宽度，不同的宽度应用不同的样式块，每个样式块对应的是该宽度下的布局方式，从而实现响应式布局。响应式布局的页面可以适配多种终端屏幕（pc、平板、手机） --> <!DOCTYPE html> <html lang="en"> < 阅读全文
posted @ 2020-03-14 16:31
kog_maw
阅读(174)
评论(0)
推荐(0)
摘要：
1 <!-- 流体布局：就是使用百分比来设置元素的宽度，元素的高度按实际高度写固定值，流体布局中，元素的边线无法用百分比，可以用样式中的计算函数calc()来设置宽度，或者使用box-sizing属性将盒子设置从边线计算盒子的尺寸 2 calc()：可以同计算的方式给元素加尺寸，比如：width：c 阅读全文
posted @ 2020-03-14 16:30
kog_maw
阅读(130)
评论(0)
推荐(0)
摘要：
<!-- pc及和移动端页面适配方法：设备屏幕有多种不同的分辨率，页面适配方案有如下几种 1、全适配：响应式布局+流体布局 2、移动端适配： a、流体布局+少量响应式 b、基于rem的布局 --> 阅读全文
posted @ 2020-03-14 16:28
kog_maw
阅读(126)
评论(0)
推荐(0)
摘要：
1 <!-- background-size 新属性 2 1、length：用长度指定背景图的大小，不允许负值 3 2、percentage：用百分比指定背景图大小，不允许负值 4 3、auto：缺省值，背景图的真实大小 5 4、cover：将背景图等比缩放到完全覆盖容器，背景图有可能超出容器 6 阅读全文
posted @ 2020-03-14 16:27
kog_maw
阅读(322)
评论(0)
推荐(0)
摘要：
<!-- 视网膜屏(retina屏)：是指屏幕的物理像素密度更高的屏，有两倍屏和三倍屏，会导致原来在pc端显示的图片在移动端变模糊,解决方法是一开始就准备大一倍的图，然后用样式将其压小一倍--><!DOCTYPE html><html lang="en"><head> <meta charset=" 阅读全文
posted @ 2020-03-14 16:26
kog_maw
阅读(457)
评论(0)
推荐(0)
摘要：
<!-- 网页从pc端到移动端，先经过viewport视口转成980px或者1024px，然后再等比例放缩在移动端显示,解决方案：去掉视口作用，在头部增加如下信息 --> <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <!- 阅读全文
posted @ 2020-03-14 16:25
kog_maw
阅读(151)
评论(0)
推荐(0)
摘要：
1 <!-- css权重： 2 css权重指的是样式的优先级，有两条或者多条样式作用于一个元素，权重高的那条样式对元素起作用，权重相同的，后写的样式会覆盖前面的样式 3 4 权重的等级：可以把样式的应用方式分为几个等级，按照等级来计算权重 5 1、!important，加在样式属性后，权重值为100 阅读全文
posted @ 2020-03-14 15:53
kog_maw
阅读(213)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>loading动画</title> 6 <style type="text/css"> 7 @keyframes loading{ 8 fr 阅读全文
posted @ 2020-03-14 15:52
kog_maw
阅读(134)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>旋转的风车</title> 6 <style type="text/css"> 7 @keyframes fengche{ 8 form{ 阅读全文
posted @ 2020-03-14 15:51
kog_maw
阅读(125)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 /* 定义动画 */ 8 @keyframes e 阅读全文
posted @ 2020-03-14 15:50
kog_maw
阅读(145)
评论(0)
推荐(0)
摘要：
<!-- CSS3 animation动画： 1、@keyframes 定义关键帧动画 2、animation-name 动画名称 3、animation-duration 动画时间 4、animation-timing-function 动画曲线linear(匀速)|ease(缓冲)|steps( 阅读全文
posted @ 2020-03-14 15:49
kog_maw
阅读(108)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 200px; 9 h 阅读全文
posted @ 2020-03-14 15:48
kog_maw
阅读(196)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 300px; 9 h 阅读全文
posted @ 2020-03-14 15:47
kog_maw
阅读(678)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 300px; 9 h 阅读全文
posted @ 2020-03-14 15:46
kog_maw
阅读(872)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 100px; 9 h 阅读全文
posted @ 2020-03-14 15:45
kog_maw
阅读(555)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 100px; 9 h 阅读全文
posted @ 2020-03-14 15:44
kog_maw
阅读(158)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 100px; 9 h 阅读全文
posted @ 2020-03-14 15:43
kog_maw
阅读(184)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 100px; 9 h 阅读全文
posted @ 2020-03-14 15:42
kog_maw
阅读(1022)
评论(0)
推荐(0)
摘要：
<!-- transform变换：是静态的，并不是动画，可以和transition配合做成动画效果 1、translate(x, y) 设置盒子的位移,10px,10px 2、scale(x, y) 设置盒子的缩放 2,2 表示放大一倍 3、rotate(deg) 设置盒子的旋转 4、skew(x- 阅读全文
posted @ 2020-03-14 15:41
kog_maw
阅读(153)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 200px; 9 h 阅读全文
posted @ 2020-03-14 15:39
kog_maw
阅读(412)
评论(0)
推荐(0)
摘要：
1 <!-- 一般用作活动专题网页制作，平常不太用 --> 2 <!-- transition-property 设置过渡的属性，例如：width height background-color 3 transition-duration 设置过渡时间，比如：1s 500ms 4 transitio 阅读全文
posted @ 2020-03-14 15:37
kog_maw
阅读(162)
评论(0)
推荐(0)
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body{ background-color: gold; } .box{ f 阅读全文
posted @ 2020-03-14 15:36
kog_maw
阅读(337)
评论(0)
推荐(0)
摘要：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 300px; 9 h 阅读全文
posted @ 2020-03-14 15:35
kog_maw
阅读(184)
评论(0)
推荐(0)
摘要：
index.html 代码 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmln 阅读全文
posted @ 2020-03-14 15:34
kog_maw
阅读(296)
评论(0)
推荐(0)
摘要：
阅读全文
posted @ 2020-03-14 15:20
kog_maw
阅读(75)
评论(0)
推荐(0)
摘要：
点击劫持保护 点击劫持中间件和装饰器提供了简捷易用的，对点击劫持的保护。这种攻击在恶意站点诱导用户点击另一个站点的被覆盖元素时出现，另一个站点已经加载到了隐藏的frame或iframe中。 点击劫持的示例 假设一个在线商店拥有一个页面，已登录的用户可以点击“现在购买”来购买一个商品。用户为了方便，可 阅读全文
posted @ 2020-03-14 15:07
kog_maw
阅读(122)
评论(0)
推荐(0)
摘要：
https://www.cnblogs.com/tugenhua0707/p/10909284.html#_labe0 阅读全文
posted @ 2020-03-14 14:29
kog_maw
阅读(82)
评论(0)
推荐(0)
摘要：
（Cross Site Request Forgery, 跨站域请求伪造）是一种网络的攻击方式，它在 2007 年曾被列为互联网 20 大安全隐患之一,也被称为“One Click Attack”或者Session Riding，通常缩写为CSRF或者XSRF，是一种对网站的恶意利用也就是人们所知道 阅读全文
posted @ 2020-03-14 14:09
kog_maw
阅读(132)
评论(0)
推荐(0)
浙公网安备 33010602011771号