前端
文章平均质量分 95
前端技术栈学习
Hydrion-Qlz
啥都想学又都没时间开始的大学牲
(如需博客中某文件pdf或者是需要什么资源可直接邮箱联系
qlz_huo@163.com
展开
-
CSS -- 10. 移动WEB开发之rem布局
移动WEB开发之rem布局1 rem基础2 媒体查询2.1 什么是媒体查询2.2 语法规范2.3 mediatype 查询类型2.4 关键字2.5 媒体特性2.6 案例:根据页面宽度改变背景颜色2.7 媒体查询+rem实现元素动态大小变化2.8 针对不同的屏幕尺寸引入不同的样式文件3 Less基础3.1 维护css的弊端3.2 Less介绍3.3 Less的变量3.4 Less的编译3.5 Less的嵌套3.6 Less的运算4 rem适配方案4.1 rem实际开发适配原创 2022-12-21 18:49:47 · 849 阅读 · 0 评论 -
CSS -- 09. 移动WEB开发之flex布局
移动WEB开发之flex布局1 flex布局原理2 常见的父项属性2.1 设置主轴方向 flex-direction2.2 设置主轴上的子元素排列方式 justify-content2.3 设置元素是否换行 flex-wrap2.4 设置侧轴上的子元素的排列方式(单行) align-items2.5 设置侧轴上的子元素的排列方式(多行) align-content2.6 flex-flow3 flex布局子项常见属性3.1 flex属性3.2 控制子项自己在侧轴上的排列方式 align原创 2022-12-21 18:48:18 · 346 阅读 · 0 评论 -
CSS -- 08. 移动WEB开发之流式布局
移动WEB开发之流式布局1 移动端基础1.1 浏览器现状1.2 手机屏幕现状1.3 移动端调试方法2 视口2.1 布局视口 layout viewport2.2 视觉视口 visual viewport2.3 理想视口 ideal viewport2.4 meta视口标签3 二倍图3.1 物理像素&物理像素比3.2 多倍图3.3 背景缩放 background-size4 移动端开发选择4.1 单独移动端页面(主流)4.2 响应式兼容PC移动端5 移动端常见布局5.1 流原创 2022-12-21 18:47:43 · 382 阅读 · 1 评论 -
CSS -- 07. CSS3新特性汇总(属性选择器,结构伪类,伪元素,过渡效果,动画,2D3D转换效果)
CSS 3的新特性1 CSS 3的现状2 属性选择器3 结构伪类选择器3.1 选择第n个孩子3.2 nth-child(n)3.3 nth-of-type()3.4 nth-child和nth-of-type的区别3.5 结构伪类选择器小结4 伪元素选择器4.1 案例:经过盒子显示遮罩层4.2 伪元素清除浮动5 CSS 3盒子模型6 CSS 3 的其他特性6.1 CSS 3 滤镜filter6.2 CSS 3的calc函数7 CSS 3过渡8 2D转换8.1 二维坐标系原创 2022-12-21 18:45:38 · 347 阅读 · 0 评论 -
CSS -- 06. CSS高阶技巧总结
CSS高阶技巧1 精灵图(sprites)1.1 为什么使用精灵图1.2 精灵图的使用2 字体图标2.1 字体图标的产生2.2 字体图标的优点2.3 字体图标的下载2.4 字体图标的引入2.5 字体图标的追加3 CSS三角形4 CSS用户界面样式4.1 鼠标样式 cursor4.2 表单的轮廓线4.3 防止拖拽文本域 resize5 vertical-align属性应用5.1 图片、表单和文字对齐5.2 解决图片底部默认空白缝隙问题6 溢出的文字省略号显示6.1 单行文原创 2022-12-12 22:33:12 · 413 阅读 · 0 评论 -
CSS -- 05. CSS定位方式总结
1.1 为什么需要定位1.2 定位组成1.3 静态定位 static(了解)1.4 相对定位 relative(重要)1.5 绝对定位 absolute(重要)1.6 子绝父相1.7 固定定位 fixed(重要)1.8 粘性定位 sticky(了解)1.9 定位的总结1.10 定位叠放次序 z-index原创 2022-12-12 22:30:49 · 311 阅读 · 0 评论 -
CSS -- 04. CSS浮动总结
CSS浮动1 浮动1.1 传统网页布局的三种方式1.2 标准流(普通流/文档流)1.3 为什么需要浮动1.4 什么是浮动1.5 浮动特性1.6 浮动元素经常和标准流父级搭配使用2 常见网页布局2.1 常见网页布局2.2 浮动布局注意点3 清除浮动3.1 为什么要清除浮动3.2 清除浮动本质3.3 额外标签法3.4 父级添加 overflow3.5 :after 伪元素法3.6 双伪元素清除浮动3.7 清除浮动总结原创 2022-12-10 23:10:21 · 155 阅读 · 0 评论 -
CSS -- 03. CSS盒子模型
盒子模型1 盒子模型1.1 看透网页的本质1.2 盒子模型组成1.3 边框1.4 表格的细线边框1.5 边框会影响盒子实际大小1.6 内边距(padding)1.7 外边距(margin)1.8 外边距合并1.9 清除内外边距2 圆角边框3 盒子阴影4 文字阴影盒子模型页面布局要学习三大核心, 盒子模型, 浮动 和 定位. 学习好盒子模型能非常好的帮助我们布局页面原创 2022-12-10 23:08:48 · 317 阅读 · 0 评论 -
CSS - 02. CSS进阶
CSS进阶1 Emmet语法1.1 快速生成HTML结构语法1.2 快速生成CSS样式语法1.3 快速格式化代码2 CSS的复合选择器2.1 什么是复合选择器2.2 后代选择器2.3 子选择器2.4 并集选择器2.5 伪类选择器2.6 链接伪类选择器2.7 :focus 伪类选择器2.8 复合选择器总结3 CSS 的元素显示模式3.1 什么是元素显示模式3.2 块元素3.3 行内元素3.4 行内块元素3.5 元素的显示模式总结3.6 元素的显示模式转换4 CSS的背原创 2022-12-10 23:06:43 · 351 阅读 · 0 评论 -
CSS -- 01. CSS基础
1 CSS简介1.1 HTML的局限性1.2 CSS介绍1.3 CSS语法规范1.4 CSS代码风格2 CSS基础选择器2.1 选择器的分类2.2 标签选择器2.3 **类选择器**2.4 id选择器2.5 通配符选择器2.6 基础选择器总结3 CSS字体属性3.1 字体系列3.2 字体大小3.3 字体粗细3.4 文字样式3.5 字体复合属性3.6 字体属性总结4 CSS文本属性4.1 文本颜色4.2 对齐文本4.3 装饰文本4.4 文本缩进4.5 行间距4原创 2022-12-10 23:05:33 · 455 阅读 · 0 评论 -
HTML -- 一文学会HTML及常用标签
1. HTML简介1.1 网页1.1.1 什么是网页1.1.2 什么是HTML1.1.3 网页的形成1.2 常用浏览器1.2.1 常见的浏览器1.2.2 浏览器内核1.3 Web标准1.3.1 为什么需要Web标准1.3.2 Web标准的构成2. HTML基础2.1 HTML语法规范2.1.1 基本语法规范2.1.2 标签关系2.2 HTML基本结构标签2.2.1 第一个HTML标签2.2.2 基本结构标签总结2.3 开发工具2.3.1 文档类型声明标签2.3.2 l原创 2022-12-09 16:45:06 · 663 阅读 · 0 评论 -
JavaScript -- 12. jQuery
jQuery1 jQuery简介2 使用jQuery2.1 下载jQuery2.2 引用jQuery3 jQuery的核心函数3.1 作为工具类使用3.2 作为函数使用3.2.1 将一个函数作为$的参数3.2.2 将选择器字符串作为参数3.2.3 将DOM对象作为参数3.2.4 将html代码作为参数4 jQuery对象4.1 获取DOM对象4.2 隐式迭代4.3 链式调用5 jQuery常用方法5.1 jQuery对象复制5.2 添加容器5.3 添加子元素6 事件的原创 2022-12-08 22:16:35 · 575 阅读 · 0 评论 -
JavaScript -- 11. BOM及常用对象介绍
BOM为我们提供了一组对象,通过这组对象可以完成对浏览器的各种操作BOM对象:Window —— 代表浏览器窗口(全局对象)Navigator —— 浏览器的对象(可以用来识别浏览器)Location —— 浏览器的地址栏信息History —— 浏览器的历史记录(控制浏览器前进后退)Screen —— 屏幕的信息原创 2022-12-08 22:15:15 · 398 阅读 · 0 评论 -
JavaScript -- 10. 一文了解DOM对象及常用方法
2.1.2 通过某个元素获取其他节点2.2 文本节点2.3 属性节点(Attr)2.4 事件2.4.1 直接在元素属性中设置2.4.2 设置回调函数2.4.3 元素.addActionListener()2.5 文档的加载2.6 练习2.6.1 切换图片2.6.2 实现按钮之间相互配合3. DOM的修改3.1 添加节点3.2 删除节点3.3 练习3.4 复制节点3.5 修改CSS样式3.6 读取CSS样式3.6.1 getComputedStyle()3.6.2 通过属原创 2022-12-08 22:13:40 · 619 阅读 · 0 评论 -
JavaScript -- 09. 内置对象的介绍
这部分内容开始对JS中其他的内建对象进行补充。主要包括:结构复制、序列化、Map、Set、Date、包装类、String、正则表达式以及垃圾回收(GC)1 解构赋值1.1 保留默认值1.2 接受剩余的所有参数1.3 对函数执行结果解构1.4 交换两个变量的值1.5 二维数组结构2 对象的解构2.1 声明对象同时解构对象2.2 先声明再解构2.3 解构不存在的属性2.4 设置解构别名2.5 设置解构默认值3 对象的序列化3.1 对象的序列化3.2 序列化的作用3.3 如何进行序列原创 2022-12-03 23:20:53 · 345 阅读 · 0 评论 -
JavaScript -- 08. 数组介绍
这部分内容讲解了JS中的数组,除了数组外还在这部分内容中对对象和函数的部分知识进行了补充,所以视频中的知识并不全都是数组的知识。其中包括:数组简介、遍历数组、for-of语句、数组的方法、对象的复制、冒泡排序、选择排序、高阶函数、闭包、递归、可变参数、call和apply、bind。4 数组的拷贝4.1 slice()拷贝4.2 new Array()拷贝4.3 浅拷贝和深拷贝4.4 展开运算符4.5 对象的复制4.6 使用JSON进行深拷贝5 数组去重6 数组排序6.1 冒泡排序例子:原创 2022-12-03 23:17:12 · 692 阅读 · 0 评论 -
JavaScript -- 07. 面向对象编程
这部分视频讲解了JS中面向对象相关的知识。主要包括:类、属性、方法、构造函数、封装、多态、继承、对象的结构、原型、原型链、旧类、new运算符等内容。面向对象编程1 面向对象编程介绍2 类3 属性4 方法5 构造函数6 封装7 多态8 继承9 对象的内存结构10 原型10.1 原型链10.2 原型的作用:11 修改原型12 instanceof和hasOwn12.1 instanceof12.2 in12.3 hasOwnProperty12.4 hasOwn13 旧类原创 2022-12-03 23:12:42 · 415 阅读 · 0 评论 -
JavaScript -- 06.函数知识汇总
函数1 函数介绍2 函数的创建方式2.1 函数声明2.2 函数表达式2.33 参数3.1 函数声明3.2.函数表达式3.3 箭头函数3.4 默认参数3.5 使用对象作为参数3.6 函数作为参数4 函数的返回值5 作用域5.1 函数作用域5.2 作用域链5.3 练习6 window对象7 提升7.1 变量的提升7.2 函数的提升7.3 为什么要有提升8 debug9 立即执行函数10 函数中的this10.1 普通函数的this10.2 箭头函数的this原创 2022-12-01 19:34:44 · 260 阅读 · 0 评论 -
JavaScript -- 05. 对象介绍
这部分对JS中的对象(Object)进行了讲解,但由于对象、函数和数组之间有很强的关联,所以这部分只做了简单的介绍,还有部分知识会在学习函数或数组时进行补充。1 对象介绍1.1 数据类型比较1.2 定义对象2 属性2.1 属性名2.2 属性值2.3 in运算符3 对象字面量4 枚举类型4.1 for - in语句5 可变类型5.1 回顾不可变类型5.2 对象的存储方式5.3 对象的比较5.4 指向相同对象5.5 修改对象和修改变量原创 2022-11-30 23:13:43 · 136 阅读 · 0 评论 -
JavaScript --04. 流程控制语句介绍
这部分内容讲解了JS中的流程控制语句。主要有:代码块、if-else语句、switch-case语句、while语句、do-while语句、for语句。1 代码块1.1 声明代码块1.2 let 和 var的作用域2 条件判断语句 -- if语句3 条件分支语句3.1 if-else语句3.2 if-else if-else语句3.3 练习4 Switch语句5 循环语句5.1 While循环5.2 do-while循环5.3 for循环5.4 嵌套循环6 break和conti原创 2022-11-30 23:11:27 · 339 阅读 · 0 评论 -
JavaScript -- 03. 运算符介绍
这部分内容主要讲解了JS中的各种运算符。主要有:算术运算符、赋值运算符、一元运算符、自增自减运算符、逻辑运算符、关系运算符、相等运算符、条件运算符、运算符的优先级以及隐式类型转换。1 算数运算符1.1 基础符号1.2 自动类型转换2 赋值运算符3 一元±4 自增和自减4.1 ++ 自增运算符4.2 -- 自减运算符5 逻辑运算符5.1 逻辑非5.2 逻辑与5.3 逻辑或6 关系运算符7 相等运算符7.1 `==`7.2 `===`7.3 `!=`7.4 `!==`8 条原创 2022-11-30 23:09:31 · 223 阅读 · 0 评论 -
JavaScript -- 02. 变量和数据类型
JS中的变量和数据类型:字面量和变量的介绍、变量的声明方式(let、var)、常量(const)、原始值(String、Number、BigInt、Boolean、Null、Undefined、Symbol)、值和变量在内存中的结构、不可变类型、显式类型转换等内容原创 2022-11-30 23:08:11 · 269 阅读 · 0 评论 -
JavaScript -- 01. 基础语法介绍
除此之外,推荐在学习的时候通过浏览器自带的控制台运行一些基础的js命令,实时查看运行结果,在浏览器中按F12就可以调出来控制台,使用。声明常量的时候尽量写成大写(如果表示的是int或者string类型的数据的话),但是在声明对象的时候不用声明为大写。如果更改b的值的话,并不会导致a的值发生变化,b会指向新的一片区域,那边区域存的是b的新值。在JS中,所有可以由我们自主命名的内容,都可以认为是一个标识符,像 变量名 函数名 类名…在js中变量是可以修改的,也就是可以重新赋值的,但是常量。原创 2022-11-30 22:51:48 · 349 阅读 · 0 评论 -
Nodejs -- 前后端身份认证概念及在Express中使用认证(Session,Cookie,JWT)
4 在Express项目中使用Session认证4.1 安装express-session中间件4.2 配置express-session中间件4.3 向Session中存数据4.4 从Session中取数据4.5 清空Session5 JWT认证机制5.1 了解Session认证的局限性5.2 什么是JWT5.3 JWT的组成部分5.4 JWT的三个部分各自代表的含义5.5 JWT的使用方式6 在Express中使用JWT6.1 安装JWT相关的包6.2 导入JWT相关的包原创 2022-11-29 20:50:21 · 889 阅读 · 0 评论 -
Nodejs -- 数据库基本概念的介绍及在Express中操作数据库
2. 在Express中操作MySQL2.1 在项目中操作数据库的步骤2.2 安装与配置mysql模块2.2.1 安装ysql模块2.2.2 配置mysql模块2.2.3 测试mysql模块能否正常工作2.3 使用mysql模块操作MySQL数据库2.3.1 查询数据2.3.2 插入数据2.3.3 插入数据的便捷方式2.3.4 更新数据2.3.5 更新数据的便捷方式2.3.6 删除数据2.3.7 标记删除原创 2022-11-29 20:46:36 · 933 阅读 · 0 评论 -
Nodejs -- nodejs简介
nodejs官网Node.js® 是一个基于 Chrome V8 引擎 的JavaScript 运行时环境如果将js代码放到浏览器执行说明是在做前端开发,放到nodejs中运行说明在做后端开发。原创 2022-11-22 16:57:03 · 475 阅读 · 0 评论 -
Nodejs -- 一文了解Express模块
1. 初识Express1.1 Express简介1.1.1 什么是Express1.1.2 进一步理解Express1.1.3 Express能做什么1.2 Express的基本使用1.2.1 安装1.2.2 基本使用1.2.3 监听GET请求1.2.4 监听POST请求1.2.5 把内容响应给客户端1.2.6 获取URL中携带的查询参数1.2.7 获取URL中的动态参数1.3 托管静态资源1.3.1 expess.static()1.3.2 托管多个静态资源目录1.3.3原创 2022-11-28 21:40:41 · 1170 阅读 · 0 评论