- 博客(39)
- 收藏
- 关注
原创 (47)2020-03-09(git、gitee)
git、giteeGit1、什么是git2、什么是版本控制系统具体功能版本控制的工具3、下载和安装下载:安装检测是否成功安装全局配置4、基本操作4.1初始化仓库4.2 将工作区的内容添加到暂存区4.3 查看工作区和暂存区状态4.4 暂存区撤回内容4.5 形成历史版本4.6 查看历史版本4.7 回滚历史版本4.8 删除历史版本5、GitHub6、git相关文件readme.md 说明文件.gitignore 忽略文件。.gitkeep 占位文件7.将本地git仓库上传到远程1.建立一个远程仓库2.确认本地仓库
2021-03-09 19:28:19
219
原创 (46)2020-03-08(同源策略和跨域、JQuery发送ajax请求、bootstrap插件的使用)
同源策略和跨域、JQuery发送ajax请求一、同源策略1、什么是同源?2、为什么制定同源策略?3、什么是跨域?4、解决跨域的三种方法1.jsonp原理:2.cors3.代理正向代理二、JQuery发送ajax请求1、get请求2、post请求3、Ajax请求一、同源策略1、什么是同源?所谓同源是指:域名、协议、端口 相同。检测以下地址和http://www.cnblog.com/ricolee是否同源:URL 、 结果 、 原因http://www.cnblog.com/ric
2021-03-08 19:56:34
415
原创 (18)2020-12-24(rem布局、sass入门、彩色图标的引用)
rem布局一、rem布局1、 rem2、 rem布局的原理3、 rem布局的实现方式4、 用vw实现rem布局一、rem布局1、 remem:相对单位,它需要一个参考属性。参考属性为: 当前元素的字体大小。rem:相对单位 root em。 参考值为:HTML根标签的font-size的值。iPhone5 320px 上面有640个像素点。 1px=1个物理像素点 1px=2个物理像素点。 160/320 一半iPhoneX 375px 187.52、 rem布局的原理
2021-03-06 16:35:07
233
原创 (30)2021-01-19(正则)
正则1、正则概念2、创建正则对象3、方法4、 修饰符5、字符串中使用正则6、字符的使用元字符(1)(2) 空白字符(3)锚字符(4)限定元字符(5) |(6)修饰符(7)转义字符的使用7、补充8、示例9、(案例)注册表单验证1、正则概念正则对象:RegExp。js 最初就是用来做表单验证的。什么是正则表达式:regular expression : js中RegExp类表示正则表达式 它是一个描述字符模式的对象。正则作用:1.用来验证字符串是否符合规则。2.从字符串中获取一部分符
2021-03-06 15:53:27
331
原创 (21)2020-12-31(程序的三大流程语句)
运算符程序的三大流程语句1、顺序语句2、选择语句(1)if语句(2)多分支if语句(3)switch语句程序的三大流程语句顺序:从上往下执行选择:根据不同的情况,执行相应的操作循环:重复做一件事情1、顺序语句顺序:最基本最简单的程序流程结构2、选择语句(1)if语句格式:if(条件表达式){ 条件为true时,执行的代码;}else{ 条件为false时,执行的代码;}【注】小括号中可以写任何表达式,但是推荐使用条件表达式。默认为双分支。else可以省
2021-03-06 14:24:28
464
原创 (45)2021-03-05(Ajax)
AjaxAjax1、http协议什么是http协议常见的协议类型http传输过程TCP三次握手 四次挥手请求报文响应报文2、Ajax介绍异步和同步传统的前后端交互的缺点3、Ajax的特点4、状态码与状态值常见的状态值请求方式5、Ajax使用(1)发送一个get请求(2)发送一个post请求(3)封装get请求(4)封装post请求(5)封装ajax请求data.phppost.php6、Ajax使用案例:qq测凶吉Ajax1、http协议什么是http协议传输协议。前端以什么样的形式给服务器传送数
2021-03-05 19:11:57
298
原创 (39)2021-02-25(ES6对象的扩展:对象属性的简洁表示法、属性名表达式、扩展运算符(...))
ES6对象的扩展:对象属性的简洁表示法、属性名表达式、扩展运算符(...)一、对象的扩展1.对象属性的简洁表示法1.1 方法的简写2.属性名表达式3.扩展运算符(...)一、对象的扩展1.对象属性的简洁表示法ES6可以在对象的大括号中,直接写入变量 和函数,作为对象的属性和方法。如果属性名与变量名相同,则可以简写,只写属性名即可。var name = "赫本";var obj = {name};console.log(obj);//{name:赫本}//相当于var name = "赫本";
2021-02-25 20:42:22
373
原创 (35)2021-02-24(ES6:函数扩展:函数参数的默认值、rest参数、箭头函数)
函数扩展:一、函数扩展1.函数参数的默认值作用域2.rest参数2.1 基本用法2.2 rest参数和arguments对象的区别3.箭头函数3.1 定义3.2 语法3.3 其他写法3.4 箭头函数中this指向二、例子1、默认值一、函数扩展1.函数参数的默认值ES6之前,不能为函数的参数设置默认值,只能在代码中进行判断function show(a,b){ if(typeof b === "undefined"){ b = 0; } console.log
2021-02-25 18:58:38
98
原创 (36)2021-02-25(ES6:数组的扩展、对象的扩展)
数组的扩展、对象扩展方法一、数组的扩展1、forEach() --------- 数组遍历方法2、map() --------- 数组遍历方法3、Array.form()--------可以将类似数组的对象转为真正的数组3.1、将伪数组转为数组3.2、将arguments对象转为数组3.3、将对象转为数组4、Array.of() --------- 将一组值,转换为数组5、copyWithin()6、find()和findIndex()7、keys(),values()
2021-02-25 17:35:12
294
原创 (34)2021-02-24(ES6变量的解构赋值)
ES6变量的解构赋值一、 变量的解构赋值1.什么是解构2.数组解构赋值不完全解构3.对象解构赋值方法解构注意点4.字符串解构5.函数参数的解构赋值6.用途6.1 交换变量的值6.2 从函数中返回多个值6.3 函数参数的定义二、 例子一、 变量的解构赋值1.什么是解构ES6中,按照一定的模式,从数组或对象中提取值,对变量进行赋值。这个过程叫做解构赋值。2.数组解构赋值//ES6之前const arr = ["诺手","蝎子","劫","EZ","女坦"];let nuo = arr[0];le
2021-02-24 20:21:38
226
原创 (33)2021-02-24(ES6,ES6新增关键字let、const、块级作用域)
ES6,ES6新增关键字let、const、块级作用域一、let1.ES6简介2.let关键字2.1 不存在变量提升2.2 暂时性死区2.3 不允许重复声明3.块级作用域3.1 为什么需要块级作用域缺点1:内部变量可能会覆盖外层的变量缺点2:for循环中的计数变量泄露为全局变量。3.2 ES6块级作用域4.案例二、const1.基本用法1.2 必须初始化1.3 一般变量名大写1.4 也有块级作用域1.5 不存在变量提升1.6 不可重复声明1.7 对于数组和对象中的元素进行修改,不算对常量的改变三、例子1.l
2021-02-24 19:04:23
381
原创 (32)2021-2-23(this指向、强行改变this指向)
this指向、强行改变this指向1.this2.几种情况3.强行改变this指向的方法3.1 call()3.2 apply()3.3 bind()4.例子4.1对应(2.几种情况)4.2对应(3.强行改变this指向)1.this在每一个函数中,都有一个内置的变量 this。大部分情况下,这个this存储是当前函数的调用者。this的指向在函数定义的时候是确定不了的。只有函数执行的时候才能确定this到底指向谁。2.几种情况1.全局变量中指向window2.在对象的方法中指向调用者。3.在
2021-02-23 20:49:40
160
原创 (20)2020-12-30(运算符)
运算符1、运算元、表达式2、数学运算符3、一元运算符4、 赋值运算符1、运算元、表达式运算元:运算符应用的对象。 1 + 2 = 3一元运算符:只有一个运算元的运算符。 var a = -1; a = -a;表达式:由运算符和变量/常量组成的式子a+1 1+2 3+5 5-4 a-b c*d2、数学运算符常见的数学运算符 + - * / 余数运算符:% 指数:**1.多个数字和字符相加时,注意顺序不同,结果也会不同va
2021-02-23 18:53:33
109
原创 (11)2020-12-15(过渡,2D转换(缩放、位移、旋转、倾斜)
2D旋转、位移、角度、偏移1、浏览器前缀2、过渡(transition)例子1,小米图标2,小米图标(伪元素写法)3、2D转换(transform属性)transform属性(1)缩放(scale)(2)位移(translate)(3)旋转(rotate)(4)变换原点(transform-origin )(5)倾斜 (skew)(6)例子1、扑克牌2、小火箭3、倾斜案例1、浏览器前缀w3c会员:各大互联网巨头它设定了整个平台的规则,监督整个过程。现在学习的是css2.1 但是到css3时,就要
2021-02-22 16:49:28
450
原创 (04)2020-12-04(表单和样式介绍)
表单和样式介绍一、表单1、表单2、标签介绍1、 form标签2、 input标签: 单标签(1)输入框(type="text")(2)密码框(type="password")(3)单选框(type="radio")(4)多选(type="checkbox")(5)提交按钮可分为三种(6)文件上传(type="file")(7)隐藏域(type="hidden")(比如:个人信息ID)3,表单通用属性4,label标签5,下拉菜单(select标签、option标签)6,optgroup标签:分组7,文本
2021-02-22 16:49:01
130
原创 (01)2020-12-01(基本概念)
基本概念前言一、前端工程师简介二、学习内容1.学习三阶段2.拓展复习总结前言前端工程师入门培训一、前端工程师简介前端工程师是互联网时代软件产品研发中不可缺少的一种专业研发角色。从狭义上讲,前端工程师使用 HTML、CSS、JavaScript 等专业技能和工具将产品UI设计稿实现成网站产品,涵盖用户PC端、移动端网页,处理视觉和交互问题。从广义上来讲,所有用户终端产品与视觉和交互有关的部分,都是前端工程师的专业领域。二、学习内容1.学习三阶段初级阶段:掌握Html,CSS,JS中级阶段
2021-02-22 15:56:13
60
原创 (31)2021-01-20(JSON字符串和本地存储)
JSON字符串一、json字符串二、示例1、对象或数组转JSON字符串2、JSON字符串转对象或数组三、本地存储1、本地存储与服务器存储2、localstorage3、sessionstorage4、cookie一、json字符串普通字符串 “abc123truelkgsjhgo”html格式字符串 "<h1>hgahgo</h1>" json格式的字符串键值对格式。 ‘“name”:“yasuo”’键和值都需要用双引号去包括。json用途:在
2021-01-20 18:34:35
448
原创 (22)2021-01-04(数组array)
数组array一、数组array1、数组概念:2、 数组声明3、数组的长度arr.length4、数组的下标5、访问数组元素6、数组的遍历 (循环)二、数组方法1、push()2、pop()3、unshift()4、shift()5、concat()6、slice()7、splice()8、 join()一、数组array当我们需要处理一组数据时,一次性定义很多变量,比较难处理。这个时候我们就需要用到数组。1、数组概念:数组:一组数据的集合。其中每个数据被称为数组的元素。在数组中存放任意类型的数据
2021-01-09 17:19:40
464
原创 (25)2021-01-07(定时器)
定时器一、定时器一、定时器种类1、setInterval()2、setTimeout()二、制作时钟三、制作秒表一、定时器一、定时器种类在js中定时器有两种(1)setInterval()(2)setTimeout()1、setInterval()可以执行无数次。格式:var 变量名 = setInterval(“执行的语句”,每隔多久执行一次);【注意】执行语句:可以写执行的代码,也可以直接传入函数。返回值:启动定时器时,系统分配的编号关闭定时器的方式:1.关闭页面。2.cl
2021-01-09 16:02:54
194
原创 (26)2021-01-08(BOM(window)和Dom)
window子对象locationnavigatorhistory浏览器卷曲的高宽浏览器滚动自定义滚动的速度locationhttps://baike.baidu.com/item/%E9%A9%AC%E4%BF%9D%E5%9B%BD/50106525?fr=aladdin#2_1(1) http https 传输协议(2) www.baidu.com 域名(3) ?fr=aladdin 查询字符(4) #2_1 hash(锚点定位)location对象:里面存储了和网页地址所有
2021-01-09 15:39:50
339
1
原创 (24)2021-01-06(对象object)
对象object一、对象1、数据类型2、对象3、创建一个对象3.1新增属性3.2使用属性3.3新增方法3.4遍历属性3.5 删除属性二、对象的分类三、基本类型与引用类型的区别四、Math对象Math.random(); 返回0-1之间的随机数。Math.round() 四舍五入Math.max() 返回最大值Math.min() 返回最小值Math.abs() 返回绝对值Math.ceil()向上取整Math.floor() 向下取整Math.pow(x,y) x的y次方Math.sqrt(
2021-01-06 20:59:07
556
原创 (23)2021-01-05(函数function)
函数function一、函数二、自定义函数(1)无参数无返回值(2)有参数无返回值(3)无参数有返回值(4)有参数有返回值三、封装函数四、arguments(存储实参)五、作用域六、递归一、函数函数作用:1.简化代码2.方便维护3.提高开发效率4.提高了代码的复用性,减少代码冗余格式:function 函数名(参数…){函数执行的代码}【注意】函数先定义后调用函数分类:1.内置函数(官方提供的函数,系统自身拥有函数)alert();document.write();con
2021-01-05 19:41:39
274
原创 (19)2020-12-29(js入门:变量和八大数据类型)
js入门1、js书写位置2、js注释3、js输出4、语法5、变量(1)变量的定义和赋值(2) 标识符(3) 关键字(4) 保留字6、 八大数据类型:(1)数值number(2)字符串(3)其他类型7、 类型转换8、 用户输入1、js书写位置(1)内嵌式使用的是Script标签,该标签可以写在html文档中的任何位置【强调】一般情况下,我们应该将其写在head标签中。(2)外链式通过script标签的src属性,引入外部的js文件。<script src="js/demo.js">
2020-12-29 20:12:48
171
原创 (10)2020-12-14(背景图、css3颜色、css3文本、css3盒子属性、线性渐变、径向渐变)
背景2、背景大小3、背景平铺4、背景图定位 (精灵图)5、背景滚动6、背景原点7、背景裁切## 一、背景### 1、背景图片background-image; 设置图片为背景。2、背景大小background-size:设置背景图片的大小属性值:px 百分比 单词百分比:background-size: 100%;(表示背景图片的宽,高正好是父框的宽,高)单词:都会让图片等比例缩放。cover 将盒子铺满背景图,但是不保证图片的完整显示。(一张图片等比例缩放满屏,图片可能不完整)c
2020-12-24 19:16:22
419
2
原创 (09)2020-12-11(盒子隐藏、鼠标悬停显示)
盒子隐藏、鼠标悬停显示1、盒子隐藏2、鼠标悬停显示(下载APP二维码)1、盒子隐藏让盒子隐藏起来,给盒子添加属性display:none;让隐藏盒子显示出来,给盒子添加属性display:block;(若不是块元素,也可以display:inline;)2、鼠标悬停显示(下载APP二维码)(1)搭建HTML结构:悬停下载的div:写在a标签中,便于悬停控制当前div <div class="appcode">
2020-12-24 19:12:10
1677
2
原创 (17)2020-12-23(三栏布局、视口、百分比布局、媒体查询)
三栏布局、视口、百分比布局、媒体查询一、三栏布局三栏布局的实现方式1、圣杯布局2、双飞翼布局3、利用弹性盒子实现三栏二、视口三、流式布局 / 百分比布局四、媒体查询1、 **媒体查询 实现方式:**2、 逻辑关键字(1)逻辑或(and)(2)逻辑与(,)(3)逻辑非(not)3、 设备方向4、 常见的查询特性5、 示例:一、三栏布局三栏布局的实现方式1、圣杯布局总结:1.在主体内部外面嵌套了一个div2.center在结构上靠前(写在left、right前)3.center,left,
2020-12-23 17:42:52
401
原创 (16)2020-12-22(H5语义化标签和BFC应用)
语义化标签和BFC应用一、语义化标签二、BFC1、之前遇到的问题(1)外边距塌陷(2)外边距重合(3)父类高度塌陷(4)浮动对普通元素的影响2、BFC介绍3、如何生成BFC4、BFC应用(1)解决外边距margin塌陷(2)解决外边距重合(3)解决父类高度塌陷(4)阻止元素被浮动元素遮盖一、语义化标签H5标签在IE9之前都需要转换成块级元素 display:block在移动端就不需要考虑兼容问题。 H5+css3可以放心的在移动端使用。1.nav 定义导航2.header 表示网页的头部。通常
2020-12-22 18:42:00
73
原创 (15)2020-12-21(弹性盒子)
弹性盒子1、弹性盒子与弹性元素2、弹性盒子的声明3、弹性盒子的属性(父元素的属性)(1)、flex-direction(2)、 flex-wrap(3)、 flex-flow(4)、 justify-content(5)、 align-items(6)、align-content(7)、align-self(弹性元素的属性,设置子元素)4、弹性盒子空间分配(设置给弹性元素)(1) flex-grow(2) flex-shrink(3) flex-basis(4) 复合写法(5)属性order1、弹性盒子
2020-12-21 20:02:14
493
原创 (13)2020-12-17(动画与滤镜)
动画一、动画1、动画定义(@keyframs)2、动画的调用(animation)(1)animation-name:动画名称(2)animation-duration :执行一次动画的完成时间。(3) animation-iteration-count: 动画的执行次数(4) animation-delay: 动画延迟执行的时间。(5) animation-fill-mode:(6)animation-direction: 动画的执行方式(7) animation-timing-function:动画
2020-12-17 20:53:30
82
原创 (12)2020-12-16(3D旋转、位移)
3D1、透视(perspective)2、3D呈现(transform-style:persevere-3d;)3、3D旋转(transform:rotate(deg))4、3D位移(transform: translate(px))5、知识点6、例子(1)百度钱包(2)立方体相册1(2)立方体相册2(3)走马灯相册1、透视(perspective)透视属性:设置给变换盒子的父容器。单位:px透视:设置用户眼睛与屏幕的距离。透视效果只是视觉上的呈现,不是真正的距离。perspectiv
2020-12-17 13:44:29
244
1
原创 (08)2020-12-10(清除浮动/解决父类塌陷问题、定位问题、ifont图标)
清除浮动/解决父类塌陷问题一、清除浮动1,父类塌陷产生原因2,解决方法(不推荐,只做了解)3,解决方法1, **css的伪元素**,是指他们不是真正的页面元素。html中并没有对应的结构,但是其用法与表现,行为与真正的页面元素一样。2,清除浮动/解决父类塌陷4,ifont图标二、定位问题1,css中定位属性最常用的三种:绝对定位,相对定位和固定定位。2,相对定位3,绝对定位4,压盖效果5,z-index属性6,固定定位一、清除浮动1,父类塌陷产生原因前提:父元素没有设置高度,高度由子元素高度撑开。
2020-12-10 20:12:33
611
原创 (07)2020-12-09(盒模型)
盒模型盒模型1,什么叫盒模型2,内边距 (padding)3,边框(border)4,制作三角5,外边距(margin)6,高度不固定7,父子盒模型(嵌套盒模型)8,外边距塌陷9,嵌套盒子的外边距塌陷10,盒模型分类11,标准文档流12,将html元素按照显示类型分类13,浮动(float)(1)脱离标准文档流(2)设置浮动的方法:(3)元素贴靠(4)字围效果(5)收缩(6)浮动的嵌套盒模型1,什么叫盒模型盒子:容器盒子模型 英文:box model。最常见的盒子是div span盒子中的区
2020-12-09 20:52:47
140
原创 (06)2020-12-08(CSS样式的特性与属性)
CSS样式的特性与属性一、CSS样式的特性1,继承性2,层叠3,!important的运用一、CSS样式的属性1,行高(line-hight)2,字体大小(font-size)3,字体(font-family)4,字体加粗( font-weight)5,字体样式(font-style)6,文本溢出7,段落水平对齐方式(text-align)8,文本缩进(text-indent)9,文本修饰(text-decoration)10,单词间距(word-spacing)11,字母间距(letter-spacin
2020-12-08 20:51:49
94
原创 (05)2020-12-07(选择器)
选择器一、四种基本元素选择器1,标签选择器2,ID选择器3,类选择器 (class选择器)3,通配选择符 (*)二、四种关系选择器1,后代选择器(空格)2,子代选择器(>)3,相邻选择器(+)4,兄弟选择器(~)三、交集和并集选择器1,交集选择器(选择器之间没有任何符号)2,并集选择器(选择器之间用,隔开)四、伪类选择器1,序选择器E:first-child{}E:last-child{}E:only-child{}2,nth-child(n)选择器3,nth-of-type(n)选择器(1) E:f
2020-12-07 20:57:10
124
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人