自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(33)
  • 收藏
  • 关注

原创 s对象排序

【代码】s对象排序。

2022-10-11 15:44:53 105 1

原创 Vue/uniapp前端解决跨域has been blocked by CORS policy: Response to preflight request doesn‘t

前端解决跨域报错解决报错解决(uni-app)一、找到manifest.json文件点击源码视图二、添加如下代码配置代理 注意: “ a/ ” 与你自己接口路径前头的匹配 "h5" : { "title" : "h5", "devServer": { "proxy":{ "a/":{ "target":"http://10.18.1.23:10086" } } } }三、数据请求页面:这里的a与代理的a开头都是

2022-05-17 12:01:11 2859

原创 react 基础 react脚手架安装与使用教程

react 基础 react脚手架安装与使用教程安装node与npm你需要在你的机器上安装 Node >= 10.16 和 npm >= 5.6 版本。要创建项目,请执行: npx create-react-app my-app如果遇到yarn报错,可以升级yarn(本人当时嫌麻烦 直接删除掉了 。。。)启动项目进入需要安装的文件夹的命令行cd my-app然后再根文件的命令行输入 npm startreact的使用1、进去后找src>index.js 全部删了 里面

2021-08-02 11:47:59 346

原创 express4.0讲解 (二)

三、Express路由概念:Express路由的路由分为两类app级路由和子路由。应用级路由:主路由,书写在启动文件内的响应路由,称为主路由。(即写在app.js)路由级路由:子路由,采用express.Router()方法创建的路由,通常写在搭建项目时的自定义路由文件夹(router)的文件中,即就是将路由进行模块化操作,在启动文件中,以中间件的形式引入模块化的路由文件。Express路由常用的响应的方法**注:**Express响应路由的匹配规则是 请求方式和响应方法必须对应 ,请求路由和响

2021-03-08 20:50:18 410

原创 express4.0讲解(一)

第7-8讲 Express4.x基础知识讲解一、基础知识概念:Express 是一个简洁、灵活的 node.js Web企业级应用框架。特性:路由和中间件二、搭建Express项目自动搭建Express项目通过express-generator生成器搭建Express项目步骤1.安装express-generator生成器npm i express-generator -g2.安装express框架npm i express3.使用命令创建express (参数) 项目名称

2021-03-08 20:49:18 448

原创 Node.js基础教学(三)

九、HTTP模块1、基本概念1.1 交互模式B/S:指基于 浏览器(Browser) 和 服务器(Server) 这种交互形式C/S:指基于 客户端(Client) 和 服务器(Server) 这种交互形式1.2 终端的概念:服务器:在网络节点中,专门对外提供资源服务的机器;客户端:在网络节点中,专门用来消费服务的一台电脑;1.3 静态资源与动态资源:静态资源:服务器端只需要读取并直接发送给客户端、不需要进一步处理的资源。动态资源:服务器端没有现成的资源,需要服务器端动态生成的资源。2

2021-03-08 20:47:48 195

原创 Node.js基础教学(二)

六、包与NPM包包的组成● 包结构:用于组织包中的各种文件● 包描述文件(package.json):描述包的相关信息,以供外部读取分析package.json文件的介绍{“name”: “package”, // 项目标识,即项目的名称,注:不能使用中文“version”: “1.0.0”, // 项目的版本号,主版本.次版本.修订版本"description": "a good demo", // 项目的描述"main": “index.js", // 项目入口文件“dep

2021-03-08 20:46:10 223

原创 Node.js基础教学(一)

一、Node.js 简介概念:Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。**注:**是 Node 选择了 JavaScript,不是 JavaScript 发展出来了一个 Node。运行命令:1. 查看node版本号node -v2.查看NPM命令的版本号npm -v3. Node命令运行js文件node 文件名(.后缀名)**注:**后缀名可以用省略4. 清屏命令cls5. 返回上一级目录cd ..6. 返回根目录c

2021-03-08 20:45:17 191

原创 ES6详细解说,基础教学(四)

十六、ES6中的面向对象类的定义语法:class 类名 {}//定义类,关键词classclass Furist{}//类的使用(类的实例化),关键词newlet f=new Furist();//f叫做类的引用类中的结构类中可以定义方法(函数),也可以定义属性。类的方法类中的方法包含3类,构造方法、成员方法、静态方法构造方法关键词constructor语法:constructor(){}class Fruit{ constructor(){//类的构造方法

2021-03-08 20:43:44 109

原创 ES6详细解说,基础教学(三)

十三、Generator简介Generator 函数是 ES6 提供的一种异步编程解决方案。语法上,可以把它理解成一个状态机,封装了多个内部状态。在Generator 函数执行时会返回一个遍历器对象,可以一次遍历函数内的每一个状态。关键词星号,用来修饰函数(只能放在function关键词与函数名的中间位置),yield 用来定义状态(异步操作)Generator函数的创建定义Generator函数及状态的定义。 function * f(){//Generator函数

2021-03-08 20:41:31 186

原创 ES6详细解说,基础教学(二)

八、函数扩展8.1 箭头函数8.1.1概念:ES6允许用箭头(=>)声明函数。()=>{}等价于function (){},用箭头声明的函数称之为箭头函数。8.1.2 箭头函数的参数1. 无参数 let a=() => {}2.有参数一个参数的形式规则:箭头函数中有且只有一个参数的时候,()可以省略。// let c=m=>{};//等同于let c=(m)=>{};多个参数let a=(m,n)=>{console.log(m*n);}

2021-03-08 20:40:21 182

原创 ES6详细解说,基础教学(一)

一、ECMAScript简介ECMA (欧洲计算机制造商协会)这个组织的目标是评估、开发和认可计算机标准。1996 年 11 月,Netscape( JavaScript 的创造者,网景公司),决定将 JavaScript提交给ECMA。1997年,ECMA发布并规定了浏览器脚本语言的标准,即ECMA1.0版。ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,在 2015 年 6 月正式发布。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型

2021-03-08 20:39:03 192

原创 二十一、 this和自定义属性

this和自定义属性1.while类while 语法 : var i = 0; //初始化循环变量 while(i<5(循环条件)){ //循环体代码 i++ //更新循环变量 } 不推荐使用whiledo-while 语法 : var j = 0;//初始化循环变量 do{ //循环体代码 //更新循环变量 }while(循环条件) 执行顺序 1.初始化循环变量 2.执行

2020-12-17 23:21:40 178 1

原创 二十、js流程控制语句

js流程控制语句流程控制语句分类1.顺序结构流程控制语句:js代码 按照从上到下的顺序 执行2.选择结构流程控制语句​ if类1.if流程控制语句 做判断语法 : if(判断条件){ 条件成立执行的代码 }简写形式 : if(判断条件) 条件成立执行的代码 if只能控制其后的第一句代码2.if-else 做判断语法 : if(判断条件){ 条件成立执行的代码 } else{ 条件不成立执行的代码 }3.if-else 的嵌套 如果我们需要同时满足多个条件 这时就需要使用if的

2020-12-17 23:20:43 132

原创 十九、 js的数据类型 和 类型转换 及 运算符

js的数据类型 和 类型转换 及 运算符数据类型简单(值/基本)类型数据: 熟练掌握​ 1.Number 数字 整型:整数 浮点型:小数 基本和数学中数字的概念完全相同​ 数字类型数据详解​ 1.数字类型数据分类 熟悉​ 整型:123 -123 123.0​ 浮点型:123.5 .5 不建议使用浮点型数据进行运算​ NaN:计算错误时得到NaN NaN全拼为 Not a Number 特性:NaN不等于任何数字 NaN和任

2020-12-17 23:19:07 130

原创 十八、javascript的初识、javascript的简单操作

javascript初识1.二阶段知识点简介ECMAScript+DOM+BOM 15天项目阶段 4天jQuery 5天阶段考核 1天2.二阶段知识点 和 一阶段 的 差别html css jshtml:页面的结构层 只有结构 样式并不好看css:页面的样式层 可以对页面进行修饰,美化页面,但是没有行为javascript:页面的行为层 可以给页面添加行为 让页面可以呼应用户的操作3.知识点重要性分类了解:听说过。熟悉:比较重要,要求大家能做到理解概念的含义。熟练应

2020-12-17 23:17:46 499

原创 十七、 网格布局

网格布局Flex 布局是轴线布局,只能指定"项目"针对轴线的位置,可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列",产生单元格,然后指定"项目所在"的单元格,可以看作是二维布局。Grid 布局远比 Flex 布局强大。1、基本概念(1)容器采用grid布局(display:grid)的元素就成为容器(2)项目容器下面的直接子元素就是项目(3)行容器中的水平区域就是行(4)列容器中的垂直区域就是列(5)单元格行与列的交叉的区域就是单元格有一个m行n列的网格,会产生m*

2020-12-10 19:13:16 318

原创 十六、响应式布局的概念、 响应式布局的概念、通过媒体查询来适配样式、百分比布局、响应式图片的处理、响应式的优缺点

一、响应式布局的概念2010年5月提出二、响应式布局的概念1、标签设置<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><!-- 如果可能,调用 chome 内核,或者高版本的 IE 内核 --><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&

2020-12-10 19:11:50 249

原创 十五、less语法、移动端浏览器及内核分析、viewport、移动端适配方案、移动端重置样式、移动端特殊处理、移动端其他适配方案设备像素、独立像素和css像素、

一、less语法1、注释less共有两种注释风格。标准的CSS注释,多行注释 /* comment */ ,会保留到编译后的文件。单行注释 // comment,只保留在less源文件中,编译后被省略。// 单行注释,这种只会在less文件中存在,不会编译到css里面去/* 注释内容,可以被编译到css文件中去的 */2、导入@import "导入文件的地址";.css 后缀名不能省略,引入 .less 文件可以省略扩展名3、变量定义@变量名:值;使用​

2020-12-05 03:08:08 391

原创 十四、css3动画库的使用、css3弹性盒子、calc()、css3预处理、什么是less以及好处是什么。

一、css3动画库的使用animate.css css3动画库,预设了抖动(shake)、闪烁(flash)、弹跳(bounce)、翻转(flip)、旋转(rotateIn/rotateOut)、淡入淡出(fadeIn/fadeOut)等动画效果;官网地址:https://daneden.github.io/animate.css/<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"

2020-12-05 03:05:31 415

原创 十三、线性渐变、径向渐变用户界面属性、多列布局、css3过度效果、css3中的变换效果、css3帧动画

一、线性渐变重复线性渐变background: repeating-linear-gradient(red 10%,yellow 20%);线性渐变的兼容性: ie10+.box3 { background: -webkit-linear-gradient(left,red 10%,yellow 20%); background: -moz-linear-gradient(left,red 10%,yellow 20%); background: -o-linear-gra

2020-12-05 03:02:15 229

原创 十二、css简介、浏览器兼容的前缀、css3新增选择器、css3新增属性、css3背景属性。

一、css3简介CSS3 是最新的 CSS 标准。CSS3 模块:选择器、框模型、背景和边框、文本效果、2D/3D 转换、动画、多列布局、用户界面CSS3的优点:CSS3将完全向后兼容,所以没有必要修改现在的设计来让它们继续运作。网络浏览器也还将继续支持CSS2。渐进增强和优雅降级:渐进增强:针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。优雅降级:一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。区别:优

2020-12-05 02:56:38 213

原创 十一、HTML5新增的元素、HTML5新增的其他标签、HTML5兼容、HTML5新增的多媒体标签、HTML5新增的表单元素、HTML5新增的表单属性

一、HTML5新增的元素1、HTML5新增的结构标签(1)header标签​ 网页的头部标签、页眉标签,可以放logo、搜索框等<header></header> (2)footer标签网页的底部标签、页脚标签,可以放版权信息、相关阅读链接等<footer></footer>(3)nav标签导航标签,可以放导航条、侧边导航、页内导航等<nav></nav>(4)article标签文档中独立的内容,例如:一篇

2020-12-01 01:00:45 363

原创 十、文本溢出处理、BFC、BFC、浏览器常见兼容问题、CSS Hack、项目检查及测试

一、## 一、文本溢出处理1、单行文本溢出处理关键点:限制容器的宽度(width:300px)让文字在一行显示white-space: nowrap | normal;nowrap 文字强制在一行显示normal 正常溢出隐藏overflow:hidden;文字溢出部分如何进行处理(是否需要用省略号代替)text-overflow: clip | ellipsis;clip 超出部分直接裁剪ellipsis

2020-11-27 17:08:28 407

原创 九、多栏布局方案、三栏自适应布局、等高布局1

一、多栏布局方案pc端多栏布局: 宽度自适应布局1、两栏自适应布局两栏自适应布局分为:左侧宽度固定,右侧宽度自适应右侧宽度固定,左侧宽度自适应左侧宽度固定,右侧宽度自适应为例,技术原理如下:左侧盒子设置固定的宽度(绝对单位),右侧盒子设置宽度100%;左侧盒子设置绝对定位给右侧盒子添加一个子盒,并且子盒设置padding-left:左侧盒子的宽度<!DOCTYPE html><html lang="en"><head> <m

2020-11-27 13:24:01 322 1

原创 八、精灵技术、css小箭头、css滑动门技术。

一、精灵技术英文名css sprites精灵技术也叫做精灵图、雪碧图、css贴图定位、css图像拼合1、技术原理将很多的小图片拼合到一张大图上,通过background-image、background-repeat、background-position属性将需要显示的小图标正确显示出来就可以了2、优缺点(1)优点减少网页htttp请求次数,提高页面的响应速度(加载速度)减少命名困扰更换风格比较方便(2)缺点必须要限制显示容器的尺寸,需要计算二、css小箭头制作思路:制作两个

2020-11-27 13:22:23 288

原创 七、vertical-align属性、透明度属性及兼容、ps常用工具、常见的图片格式、项目规范、命名参考、iconfont的使用

一、css其他属性1、vertical-align属性设置元素的垂直对齐方式,适用于行级元素、行块级元素。(1)语法vertical-align: top | bottom | middle | baseline;top 顶部对齐,将元素与父元素中最高的元素的顶部对齐bottom 底部对齐,将元素与父元素中最低的元素的底部对齐middle 居中对齐,将元素放在父元素的中间baseline 基线对齐,将元素放置在父元素的基线的位置上(默认值

2020-11-27 13:20:33 1754 2

原创 六、定位、定位技巧、层级属性、浮动与定位的对比、表单、表单属性、

一、定位1、css的三大布局机制标准流块级元素:垂直方向上一个接一个的排列行级、行块级元素:水平上依次排列(换行或者空格会被解析为一个小空隙)浮动使元素实现水平排列(没有间隙)定位可以使元素自由摆放自己的位置2、定位定位是由定位模式和边偏移属性构成3、偏移属性left 距离左侧的偏移量right 距离右侧的偏移量top 距离顶部的偏移量bottom

2020-11-27 13:16:32 419

原创 五、标签相互转换、内联块标签垂直对齐方式、溢出内容的处理、伪元素、浮动

一、标签相互转换1.标签分类(1) 块标签特点: 默认宽度100%,独占一行,可设左右样式div h1-h6 p hr table caption tr thead tbody tfoot ul li ol dl dt dd(2)内联标签特点:默认宽度由内容撑开,多个标签在一行显示,部分样式无效(宽高,上下内外边距)span strong b em i a br del sub sup(3)内联块标签特点:

2020-11-27 13:12:51 182

原创 四、margin存在问题、内联标签使用边距、最大最小宽高、背景相关样式、进阶选择器、css三大特性

一、margin存在问题1.重叠问题问题:两个兄弟元素同时设置margin-top和margin-bottom,会出现重叠,取最大值解决办法:避免两个同时设置,只给其中一个方向设置给其中一个盒子套一个大盒子括起来,给大盒子设置overflow:hidden;形成私有区域2.塌陷问题问题:父元素里的第一个子元素设置margin-top,会传递给父元素解决办法:避免使用margin-top给父元素设置padding-top:1px;给父元素设置border-top:1p

2020-11-27 13:10:30 441

原创 三、文字样式、文本样式、颜色与单位、盒模型

一、文字样式(可继承)继承: 给父元素设置样式后,里边的子元素也可以应用上继承来的样式优先级没有自己本身优先级高1.文字大小浏览器默认字体大小16px 支持最小字体是12px font-size: 30px;2.行高技巧:行高的值和盒子高度一致时,可实现单行文字垂直方向居中line-height: 80px;3.文字是否倾斜font-style: italic; 倾斜font-style: normal; 不倾斜4.文字是否加粗font-weight:

2020-11-27 13:08:54 238

原创 二、HTML表格、列表、css引入方式、基本选择器

一、表格用途: 之前是用来布局的,现在明显是表格的数据才用1.标签块标签table 整个表格的容器tr 表示一行caption 表格标题 一个表格里只能有一个标题thead 有表格表头的语义tbody 有表格主体的语义tfoot 有表格页脚的语义内联块标签th 表示一个单元格 , 有表头的语义,自带文字加粗和居中的样式td 表示一个普通的单元格2.属性width / height设置到单元格上 , 设置宽度,该单元格所在一列的宽度

2020-11-27 13:05:51 182

原创 一、HTML的基本信息

一、三大核心语言HTML(Hypertext Markup Language) 超文本标记语言 结构CSS(Cascading Style Sheets) 层叠样式表 样式、表现JS(JavaScript) 脚本语言 行为、动作后缀: .html .css .js二、五大浏览器及其内核谷歌 chrome 内核: webkit —> blink火狐 firefox 内核: Geckoie

2020-11-27 13:03:01 304

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除