自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

斑码教育的博客

专门针对web前端知识领域,进行技术分享。提供相应的课件下载资源。斑码教育,致力于web前端培训,让天下没有难学的技术!

  • 博客(51)
  • 资源 (8)
  • 收藏
  • 关注

原创 2020年最新web学习路线,完整课程大纲 120天高薪就业

第一阶段课程大纲第 01 天 HTML初体会教学目标:了解什么是页面. 掌握html骨架的书写以及骨架中标签的作用. 快捷键操作. 相关字符编码. html标签和属性的书写语法HTTP 协议html 概念介绍html 骨架DTD 文档类型head 标签title标签meta标签字符编码body 标签html 基本语法html属性语法html 注释seo和浏览器介绍第 02 天 HTML 第一天教学目标:了解废弃标签. 实体字符,掌握 h系列. p. img. a标签的

2020-10-14 17:10:19 1005

原创 js实现可设倍数放大镜

效果图源码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <ti.

2021-03-04 14:00:08 451 2

原创 想月薪过万?这些面试准备你做好了吗?

俗话说,磨刀不误砍柴工,做好面试前的准备工作可以帮助大家更好的应对面试官的问题以及面试中的突发情况。那么面试前我们都有哪些要做的准备工作呢?面试之前应对组织进行研究1、公司的背景:公司的性质,老板的背景,创业历史等等。2、专业资质:对公司在做或即将要做的项目进行分析研究。3、愿景:公司未来的发展方向、目标或是目前正在实施的计划。4、文化:公司所倡导的文化、价值观(一般官网会做相关宣传)。5、其他:其他想要了解的内容,比如乘车路线、公司的薪资福利、未来领导的管理风格等等。..

2021-03-01 00:51:31 185

原创 应届生与IT培训生,就业谁更占优势?

随着应届生人数的逐年递增,就业形势也变得愈加严峻。在广大应聘者心中无疑最希望有更多的工作机会,而如今越发红火的互联网行业迅速吸引了大批应届生加入其中,俨然成为了人才吸纳大户。到目前为止,社会对于IT行业人才的需求很大,但各所计算机专业院校却存在着毕业生找工作难的困境。对于这两者之间的矛盾,主要是刚毕业的大学生缺乏职场竞争力,专业实践技能不足,而IT职业培训机构可以在这方面很好地帮助学生,大大提高学生的职场竞争力。随着大学生就业难,越来越多的高中毕业生倾向于去职业培训机构...

2021-03-01 00:49:10 315

原创 2021你必须了解的大前端及其发展趋势

大前端是什么?简单来说,大前端就是所有前端的统称,比如Android、iOS、web、Watch等,最接近用户的那一层也就是UI层,然后将其统一起来,就是大前端。大前端最大的特点在于一次开发,同时适用于所有平台,开发者不用为一个APP需要做Android和iOS两种模式而担心。大前端是web统一的时代,利用web不仅能开发出网站,更可以开发手机端web应用和移动端应用程序。大前端为什么出现?由于node的出现,前端工程师不需要依赖于后端程序而直接运行,从而前后端分离起来。所以当开发一个新产品的时候服务

2021-03-01 00:39:46 1733

原创 nodejs实现递归删除

// 引入fs模块var fs = require('fs');// 封装函数function del(path) { // 同步读取文件 fs.readdirSync(path).forEach(function(file) { // 判断文件的类型 var newPath = path + '/' + file; if (fs.statSync(newPath).isDirectory()) { // 是文件

2021-02-09 22:11:25 312

原创 node中的http模块的write和end的区别

response 响应对象,用于返回的内容write: 返回内容,但是不会断开连接,接收的数据类型只能是字符串和buffer数据end: 返回内容,返回之后会断开连接,接收的数据类型只能是字符串和buffer数据但是在使用write的内容的时候必须使用end才能够查看到...

2021-02-09 16:34:41 801

原创 深度解析for of以及keys、values、entries

很多同学反馈在学习ES6的时候,对于for of以及keys、values以及entries不理解,在这里给大家解释一下。首先在学习ES6之前我们遍历数组和对象的方法已经有多种了,常用的就有 for和for in。for 和 for in的区别:首先for遍历的是数组或者类数组中数组的部分,对于字符串的key没有办法遍历;for in 不仅遍历数组还可以遍历对象,对于数组而言它与for的区别在于遍历所得的key都是字符串类型,且for in 由于可以遍历对象中可枚举的属性和方法,导致for in

2020-12-29 15:30:25 1071

原创 Array.from的使用和实现

代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <li&.

2020-12-29 12:31:04 355 3

原创 isNaN和Number.isNaN的区别

isNaN是ES5中提供的全局中的方法,用来判断一个值经过数字类型转换之后,转换的值是不是NaN,如果是则返回true,反之返回false。Number.isNaN是ES6中提供的方法,他在判断的时候,不经过类型的转换直译为是否类型为数字且值为NaN,只有NaN本身可以满足,其他经过类型转换的则不算。两者最大的区别就是是否经过类型的转换。更多学习干货请进qq群:1103015245...

2020-12-29 00:08:25 215

原创 html页面各部分中css的命名规范---斑码出品,必属精品

头:header容器:container内容:content尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体佈局宽度:wrapper左右中:left right center登录条:loginbar标志:logo广告:banner页面主体:main热点:hot新闻:news下载:download子导航:subnav菜单:menu子菜单:submenu搜索:search友情链接:friendlink页脚:footer版权:copyr

2020-12-15 16:33:55 174

原创 原生js面向对象方式实现贪吃蛇---斑码出品,必属精品

index.html 入口文件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>贪吃蛇</title> <style> * { .

2020-12-15 16:18:31 128

原创 css实现元素隐藏的方法display和visibility的区别---斑码出品,必属精品

元素不可见之间的区别display: none; 宽度高度消失,元素原来的区域消失,被其他元素占用visibility: hidden; 元素消失,原来的区域继续占有,宽度和高度不消失

2020-12-14 20:13:23 102

原创 html和css定位实现二级导航栏---斑码大前端出品,必属精品

使用html和css定位完成二级导航栏制作<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .

2020-12-14 20:08:37 698

原创 jquery实现异型滚动轮播图

先上效果图:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *.

2020-11-24 14:22:45 409

原创 前端三千问---第(7)问:常用的移动端事件

1. click事件单击事件,类似于PC端的click,但在移动端中,连续click的触发有200ms ~ 300ms的延迟2. touch类事件触摸事件,有touchstart touchmove touchend touchcancel 四种之分touchstart:手指触摸到屏幕会触发touchmove:当手指在屏幕上移动时,会触发touchend:当手指离开屏幕时,会触发touchcancel:可由系统进行的触发,比如手指触摸屏幕的时候,突然alert了一下,或者系统中其他打断了tou

2020-11-19 17:37:22 175

原创 js中onmouseleave和onmouseout的区别详解

onmouseleave和onmouseout的区别:给元素绑定事件,当元素没有子元素的时候,上面两个事件没有区别。当元素有子元素的时候,上面两个的触发机制不同。onmouseleave触发的条件是当鼠标离开了父元素的区域(只要在父元素的里面即可,可以在父元素的子元素上面的),onmouseout触发条件是给那个元素绑定了,就必须只能在这个元素上,鼠标进入该元素的子元素,也表示离开了当前的元素,会触发onmouseout。<!DOCTYPE html><html lang="en.

2020-11-17 17:57:54 2359

原创 前端发展简史

1.起源在欧洲粒子物理实验室(粒子物理研究通常与来自世界各地的研究所进行合作)的IT部门工作的Tim Berners-Lee向其领导提出了一项名为Information Management: A Proposal的提议:使来自世界各地的远程站点的研究人员能够组织和汇集信息,在个人计算机上访问大量的科研文献,并建议在文档中链接其他文档,这就是Web的原型。2.发展1990年 ~ 1994年1990 年,Tim 以超文本语言 HTML 为基础在 NeXT 电脑上发明了最原始的 Web 浏.

2020-11-16 17:55:10 858 1

原创 5 款最佳最牛代码比较神器(老师检查作业也是不错的)

程序员喜欢的 5 款最佳最牛代码比较神器,必须安利!这几个神器不得不安利会给大家。平时工作效率提升60%!俗话说:三句不离本行,对于程序员这个可爱的群体来说也是一样,即使面对无休无止的编程工作,程序员们依旧任劳任怨的埋头苦干,梦想着用自己码下的代码改变世界。工欲善其事,必先利其器,每一位程序员都有自己私藏的编程必备工具,接下来我就给大家推荐5款程序员最佳的代码比较工具。一:Beyond Compare推荐:★★★★★Beyond Compare可以很方便地对比出两份源代码文件之间的不同之处,相差的

2020-11-12 17:11:15 282

原创 前端和后端之间有什么区别,应该如何选择?

零基础和想转行的同学们往往不知道自己应该学什么,下面就告诉大家前端和后端的区别,可以根据自己的兴趣,再去选择学习哪个方向。前端和后端做简单的叙述后端:入门难,深入更难,枯燥乏味,没有太大成就感,看一堆业务逻辑代码。前端:入门简单,先易后难,能看到自己做出来的展示界面,有成就感。前端和后端两者工作的内容和负责的东西是完全的不同展示方式前端指的是用户可见的界面,网站前端页面也就是网页的页面开发,比如网页上的特效、布局、图片、视频,音频等内容。前端的工作内容就是将美工设计的效果图的设计成浏览器可以运

2020-11-10 19:57:24 2310

原创 2021年web前端工程师的前景?

随着互联网的高速发展,不知不觉中我们的生活也被互联网从四面八方包围,不论是网上点餐、网上购物、网上购票,还是网上学习,这都表明了现在就是互联网的天下。因此,不少人选择学习web前端,但是担心的问题也来了,最近几年web前端发展趋势良好,但是明年是否也能保持很好?那么我们就来预测下2020年web前端的就业前景发展吧!web前端人才需求还会持续增加据国内权威数据统计,未来五年,我国信息化人才总需求量高达1500万—2000万人。其中“网络工程”“UI设计”“web前端”等人才的缺口最为突出,所以2021

2020-11-10 19:45:39 1198

原创 一篇文章搞懂js的函数所有知识

一、函数函数: 一个功能的集合体,一段功能代码1.1 函数的声明格式:function 函数名() { 函数体}函数的调用:函数不调用不执行函数调用的方式: 函数名()执行代码:<script> // 声明函数 function createTable() { // 创建表格 document.write('<table border="1" align="center">'); //

2020-11-10 19:20:12 142

原创 js中NaN详解

NaN所有数与NaN计算,结果都为NaNNaN不等于任何值,包括自己本身执行代码:<script> console.log(NaN == NaN); // false console.log(1 + NaN); console.log(1 * NaN); console.log(1 - NaN); console.log(Infinity + NaN); console.log(Infinity + 1 == Infinity)

2020-11-04 23:41:29 1826

原创 js中Boolean为false的情况

为false的情况:false00.0nullNaNundefined‘’注意:所有的引用类型转为布尔类型都为true执行代码:<script>// boolean 类型中只有true和false// 转为false的情况console.log(Boolean(false));console.log(Boolean(0));console.log(Boolean(0.0));console.log(Boolean(''));console.log(.

2020-11-04 23:40:10 957

原创 string转为字符串详解

String转为字符串执行代码:<script>// undefinedconsole.log(String(undefined)); // 'undefined'// booleanconsole.log(String(true)); // 'true'console.log(String(false)); // 'false'// numberconsole.log(String(11)); // '11'console.log(String(0b101))

2020-11-04 23:38:52 1088

原创 parseFloat详解

parseFloat转为浮点数(小数)boolean转为NaN可以智能截取字符串中只识别十进制执行代码:<script> // boolean console.log(parseFloat(true)); // NaN console.log(parseFloat(false)); // NaN // 数字: 舍去取整 console.log(parseFloat(12.4)); // 12.4 console.log(p

2020-11-04 23:37:49 8290

原创 parseInt详解

parseInt转为整数boolean类型都转为NaN可以智能截取,遇到非法字符则停止读取,截取前面舍去取整字符串中只识别十六进制和十进制执行代码:<script> // boolean console.log(parseInt(true)); // NaN console.log(parseInt(false)); // NaN // 数字: 舍去取整 console.log(parseInt(12.4)); // 12

2020-11-04 23:15:49 1759

原创 js中Number转为数字类型详解

Number转为数字true为1,false 为0遇到非法字符则为NaN可以识别二进制、十进制、十六进制,不识别八进制执行代码:<script> // 布尔类型转为数字 console.log(Number(true)); // 1 console.log(Number(false)); // 0 // 字符串转为数字: Number转为数字,字符串存在非法字符,则为NaN console.log(Number('111'));

2020-11-04 23:14:52 676

原创 双飞翼布局的实现代码和思路

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * { ma

2020-10-26 14:04:33 155

原创 圣杯布局(完整实现思路)

目标:实现三栏布局,且要求最先渲染主体内容实现步骤:主体内容在左右侧边栏之上三个部分向左浮动左边栏的margin-left: -100%;右边栏的margin-left: - 右边栏的宽度设置父元素的padding-left: 左边栏的宽度设置父元素的padding-right:右边栏的宽度设置左右边栏为相对定位设置左边栏的left值为 - 左边栏的宽度设置右边栏的right值为 - 右边栏的宽度执行代码:<!DOCTYPE html><html la

2020-10-24 23:49:01 1265

原创 百分比布局参照物的总结

百分比的参照物border:不能使用百分比width、padding、margin:参照父元素的widthheight:参照父元素的height不定位的时候,参照父元素的content-box,定位的时候,参照的是定位父元素padding-box

2020-10-24 14:18:25 116

原创 前端三千问---第(6)问:reset.css与normalize.css ---css中的样式重置

1,什么是css reset?顾名思义,css reset,样式重置。即重新设置界面的样式。2,为什么要用css reset?不同的浏览器在实现w3c标准过程中,对各个元素的实现是不一致的。这就导致了同一个页面在不同的浏览器中比如ie和chrome中,表现有差异。为了解决这个问题,即不同浏览器中表现的一致性,需要使用css reset。3,如何使用css reset?这个很简单,页面的头部引入css文件即可。在早期,有一种简单粗暴的方法:在头部直接添加style 标签。*{margin: 0;

2020-10-23 14:49:09 371

原创 前端三千问---第(5)问:HTML 中的常用标签(2020最新)

1、在HTML中,表格的标签是<table></table>2、在HTML中,单元格的标签是<td></td>3、在HTML中,表格的行标签是<tr></tr>4、在HTML中,表示空格的特殊符号是&nbsp;5、在HTML中,表单控件的标记符是<form></form>6、在HTML中,表单中多行文本域的标记符是<textarea></textarea>7、在HTML

2020-10-23 08:25:27 228

原创 2020年最新使用css3实现太极图旋转只用一个div

知识点:边框 + 旋转 + 过渡<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .

2020-10-20 16:38:42 230

原创 前端三千问---第(4)问:HTML 全局属性(global attribute)有哪些

accesskey:设置快捷键,提供快速访问元素如aaa在 windows 下的 firefox 中按alt + shift + a可激活元素class:为元素设置类标识,多个类名用空格分开,CSS 和 javascript 可通过 class 属性获取元素contenteditable: 指定元素内容是否可编辑contextmenu: 自定义鼠标右键弹出菜单内容data-*: 为元素增加自定义属性dir: 设置元素文本方向draggable: 设置元素是否可拖拽dropzone: 设置元素.

2020-10-20 15:32:02 112 1

原创 2020年最新web前端视频教程-学完高薪就业

css视频教程:https://www.bilibili.com/video/BV17y4y1C7t6?from=search&seid=13776989863154072050此视频课程后续完整更新,获得最新资料 q群1103015245js完整直播地址为B站,欢迎大家关注

2020-10-20 14:18:52 151

原创 前端三千问---第(3)问:doctype 是什么,举例常见 doctype 及特点

<!doctype>声明必须处于 HTML 文档的头部,在<html>标签之前,HTML5 中不区分大小写<!doctype>声明不是一个 HTML 标签,是一个用于告诉浏览器当前 HTMl 版本的指令现代浏览器的 html 布局引擎通过检查 doctype 决定使用兼容模式还是标准模式对文档进行渲染,一些浏览器有一个接近标准模型。在 HTML4.01 中<!doctype>声明指向一个 DTD,由于 HTML4.01 基于 SGML,所以 DTD 指.

2020-10-19 14:39:47 216

原创 2020html5语义化标签详解

HTML就是负责页面语义的,HTML4.01中,div负责的任务太多,具体的语义没有拆分。HTML5中,就是把div拆分为了更多的标签:header: 用于网站的头部,或者某一个区域的头部nav:用于导航banner:用于轮播图main: 网页的主体内容部分,该主体部分只能有一个section:网页的主体内容部分,是一个小整体,和main类似,但是section在一个页面中可以有多个,而main只能有一个article:用于标记文章或者评论hgroup:用于标记标题组,如果只有一个标题无需

2020-10-19 13:57:35 318

原创 前端三千问---第(2)问:前端工作需要掌握的工作技能,薪资待遇如何?

前端三千问—第(2)问:前端工作需要掌握的工作技能,薪资待遇如何?主要工作技能:(数据来源于拉钩、boss直聘的万条数据采集)html5、css3 (虽然不怎么提,但这是基础必须需要掌握的)JavaScript、ES5、ES6+、typescript (js系列是核心,我们要学习最新的,跟上发展的速度)ajax(这个必须,前后端数据传输靠的就是这哥们)MVVM框架类: vue、react、AngularJS (国内前两个要求的比较多,但是不代表AngularJS不好)工具类: webpack

2020-10-15 19:35:17 110

原创 前端三千问---第(1)问:前端是什么?

前端三千问—第(1)问:前端是什么?前端开发是创建Web页面或app等前端界面呈现给用户的过程,通过HTML,CSS及JavaScript以及衍生出来的各种技术、框架、解决方案,来实现互联网产品的用户界面交互 [1] 。它从网页制作演变而来,名称上有很明显的时代特征。在互联网的演化进程中,网页制作是Web1.0时代的产物,早期网站主要内容都是静态,以图片和文字为主,用户使用网站的行为也以浏览为主。随着互联网技术的发展和HTML5、CSS3的应用,现代网页更加美观,交互效果显著,功能更加强大。主要作用:

2020-10-14 17:33:06 192 1

斑码教育大前端课堂笔记-css第一天

斑码教育sy101课堂笔记完整版,笔记中包含上课所讲所有案例,详细的笔记,非常适合自学的朋友,该资源会持续更新,希望可以帮到更多学习前端的小伙伴

2020-11-24

seajs-preload.js

用于seajs的预加载使用,有需要的小伙伴可以免费下载使用。方便大家多多分享免费的资源,有问题随时给我们留言。希望能帮助大家解决更多的问题

2020-10-24

seajs-css.js

seajs-css.js 用于seajs加载css文件,上课用的课件资源,大家有需要的可以随时下载。版本是非常好用的,作为一个学习模块化我们必须的知识插件

2020-10-24

斑码教育大前端课堂笔记-html第五天

斑码教育sy101课堂笔记完整版,笔记中包含上课所讲所有案例,详细的笔记,非常适合自学的朋友,该资源会持续更新,希望可以帮到更多学习前端的小伙伴

2020-10-14

斑码教育大前端课堂笔记-html第四天

斑码教育sy101课堂笔记完整版,笔记中包含上课所讲所有案例,详细的笔记,非常适合自学的朋友,该资源会持续更新,希望可以帮到更多学习前端的小伙伴

2020-10-11

斑码教育大前端课堂笔记-html第三天

斑码教育sy101课堂笔记完整版,笔记中包含上课所讲所有案例,详细的笔记,非常适合自学的朋友,该资源会持续更新,希望可以帮到更多学习前端的小伙伴

2020-10-10

斑码教育大前端笔记-HTML第二天

斑码教育sy101课堂笔记完整版,笔记中包含上课所讲所有案例,详细的笔记,非常适合自学的朋友,该资源会持续更新,希望可以帮到更多学习前端的小伙伴

2020-10-09

斑码教育大前端课堂笔记

斑码教育sy101课堂笔记完整版,笔记中包含上课所讲所有案例,详细的笔记,非常适合自学的朋友,该资源会持续更新,希望可以帮到更多学习前端的小伙伴

2020-09-29

空空如也

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

TA关注的人

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