- 博客(41)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 MIME.json 文件请求 后缀/响应类型 对照表
{ “.323”:“text/h323” ,“.3gp”:“video/3gpp” ,“.aab”:“application/x-authoware-bin” ,“.aam”:“application/x-authoware-map” ,“.aas”:“application/x-authoware-seg” ,“.acx”:“application/internet-property-stream” ,“.ai”:“application/postscript” ,“.aif”:“audio
2020-12-08 17:45:42
716
原创 用原生实现Vue3，真香~
目标：用原生js实现自定义组件，Vue3双向绑定学前知识储备：必备知识1，自定义元素（customElement）废话不多，先上代码： //html: <user-card data-open="true"></user-card> //javascript: class Learn extends HTMLElement{ constructor(props) { super(props); cons
2020-11-11 19:21:45
783
原创 ES6系列（四）箭头函数
箭头函数本身，其实就是为了简化函数的写法，以前凡是函数都必须要带上一个function关键字，这看起来有点笨拙在我看来，对于代码来说更加精简了，但是对于我们来说，反而加大了阅读代码的难度。但是不管怎样，它都已经普及开了，今天稍微总结一下箭头函数的知识点吧。先来看看写法箭头函数对于不同的情况有不同的简化写法，大家有必要对它们熟悉，不然以后看代码可能就比较头疼咯…第一种，形参=>返回值 let fn = a => a*2; console.log(fn(10));//20可以看到
2020-11-03 23:00:36
416
转载 10分钟看懂Docker和K8S
2010年，几个搞IT的年轻人，在美国旧金山成立了一家名叫“dotCloud”的公司。这家公司主要提供基于PaaS的云计算技术服务。具体来说，是和LXC有关的容器技术。LXC，就是Linux容器虚拟技术（Linux container）后来，dotCloud公司将自己的容器技术进行了简化和标准化，并命名为——Docker。Docker技术诞生之后，并没有引起行业的关注。而dotCloud公司，作为一家小型创业...
2020-08-17 16:09:40
292
原创 一次说清楚，以后不要再问我移动端怎么适配了！
前言：首先，这篇文章讲的是网页在移动端的适配问题，这里面没有物理像素之类的事，这是两个东西，别混为一谈！有些人为了博眼球，一上来就是什么物理像素，像素比之类的字眼，这俩东西对移动端确实有影响，但是没那么大，基础的同学不需要去深究。第二，适配是一件特简单的事情，别想太复杂。像什么数学换算之类的，如果数学不太好的同学也不用太焦虑，现在开发有很多辅助工具，世界上有几个人能弄懂1+1为...
2020-04-15 17:28:32
805
2
原创 如何五分钟搞定Vue + Sass
首先，大家知道在网站开发项目的过程中，大家都普遍使用css预处理器了，也就是less，sass，stylus这三个东西，这三者的话也确实没有让大家失望，让我们的开发效率提升很多，里面有很多好用的功能，变量，嵌套，循环，继承，混合等等。不过这三者里面呢，less功能稍微欠缺了点，而stylus的话呢，由于写法比较新颖，我个人不太接受，所以今天要讲的还是sass 。其实早在2007年sass就...
2020-04-15 11:04:20
419
转载 nodeJS安装和环境变量的配置
首先在官网nodejs.org里面下载最新版本的node.js，两种版本都可以，一个是使用最多的版本，一个是最新版本。 2 下载完成后双击运行安装程序。 3 然后按指引直接下一步即可，注意到了选择安装路径的时候，不要有中文，避免出现未知错误。 这里我的安装路径是E:\node-JS 4 安装完成后，可以在CMD命令行中输入：nod...
2020-02-18 18:04:42
417
原创 Grid教程一
人类计算机技术发展到现在，每天都会有很多新的东西被创造出来，有一些受到了广泛的认可，推广开来。也有一些非常好的点，但是由于各种原因限制，而没有得到广泛的使用。今天要讨论的grid就是其中之一。grid可以说是web布局的最新解决方案，也可以说是目前最好的解决方案。以前我们布局，有一个东西叫做文档流，也就是说我们的页面其实是从上到下从左到右一点一点堆积起来的。不过有了grid之后这个情况将会...
2019-11-29 17:38:44
892
2
原创 Sass教程十一：Sass知识点之 —— 控制指令
Sass 提供了一些基础的控制指令，比如在满足一定条件时引用样式，或者设定范围重复输出格式。控制指令是一种高级功能，日常编写过程中并不常用到，主要与混合指令 (mixin) 配合使用@if@if用于定义一些条件，当输入的值满足条件时做对应的事情 当@if 的表达式成立时，输出 {} 内的代码：p{ @if 1 + 1 == 2 { width: 20px }}在这...
2019-08-09 17:10:25
327
原创 Sass教程十：Sass知识点之 —— @import 、Partials 与 @media
@import 、Partials 与 @media说到这个，有同学可能有疑问，css本身也有@import属性，sass再提出来，会不会有所多余呢？我们来分析一下css的 @import它更多是用来做媒体查询的 它每引入一个文件，都会向服务器发送一次请求 它并不是把引入的文件和当前文件进行融合 引入文件中定义的变量不能在当前文件中使用Sass 拓展了 @import 的功能，允...
2019-08-09 14:06:14
554
原创 Sass教程九：Sass知识点之——继承
@extend 继承在设计网页的时候常常遇到这种情况：一个元素使用的样式与另一个元素完全相同，但又添加了额外的样式。通常会在 HTML 中给元素定义两个 class，一个通用样式，一个特殊样式。那么通过@extend我们可以这样写：通用样式：.normal{ color: #00d5e8; background: #e8e000;}特殊样式：.special{...
2019-08-08 18:00:04
408
原创 Sass教程八：Sass知识点之——混合
前面我们已经知道sass中的变量了，但是变量能记录的毕竟只是一个值，顶多把一个属性的所有值全部记录进去，比如这样：$primary-border:1px solid #899;.box{ border:$primary-border;}这样固然可以让box这个选择器很轻松地获得一个边框样式，但是如果我有大量公用的样式呢？比如文字颜色，字体大小这些东西其实都可以统一起来，那这...
2019-08-08 16:11:29
573
原创 Sass教程七：Sass知识点之——嵌套
Sass 允许将一套 CSS 样式嵌套进另一套样式中，内层的样式将它外层的选择器作为父选择器, 考虑用css实现下面这个布局：那么用css 我们可能会这样写：nav { height: 40px; border-bottom: 1px solid #333; line-height: 40px;}nav ul { float: left; height: 100%...
2019-08-07 17:52:27
738
原创 Sass教程六：Sass知识点之——变量
变量来源于数学，是计算机语言中能储存计算结果或能表示值抽象概念。由于变量让你能够把程序中准备使用的每一段数据都赋给一个简短、易于记忆的名字，因此它们十分有用。其实这东西就和我们的姓名一样，是一个代号，或者说就像我们在公司的职称当公司需要用你的时候，直接叫这个职称，那万一哪天你离职了，或者说公司发现你不合适这个岗位了，那再换一个人就好了，职称还是那个职称，只是人不一样了比如整个网站的背景颜...
2019-08-07 16:21:24
270
原创 Sass教程五：koala 和在Vue里使用Sass
第三种，编译软件 Koala附上官网地址： http://koala-app.com/这是一个小软件，在官网上下载安装就可以了，官网可以自动分辨是windows系统还是Mac系统，所以直接点击下载就可以了。根据提示，直接把要编译的文件拖到软件里或者把整个文件夹拖到软件里就可以了点击某个文件，右边就会弹出来一个菜单，勾选最上面的 Auto Complie就可以自动监听啦，然后下面有...
2019-08-07 14:32:10
273
原创 Sass教程四：webStorm编译Sass（编辑器）
相对于第一种编译方式来说，用编辑器来帮助我们编译则省去了我们在开发过程中的很多操作，比如用cd命令进入某个文件夹，退出文件夹之类的，并且不是所有人都熟悉命令操作方式的。这时候就显得这种编译方式可能会更加好用，我在工作过程中大多数也是用这种方式来进行编译的，来看具体操作吧：注意，用编辑器编译的基础也是安装Sass 所以Sass的安装过程是必不可少的！！！既然想要让编辑器帮助我们做事情，那么就...
2019-08-06 18:28:04
844
原创 Sass教程三：编译Sass（命令行）
sass编译有很多种方式，如命令行编译模式、编辑器自动编译、编译软件koala、sass-loader等。先来看第一种：命令行编译刚才我在test文件夹里面已经建立了一个style.scss文件，现在我需要把这个文件编译成css文件，那么我可以先用命令行工具进入这个文件夹 “cd”就是进入某个文件夹的命令，后面跟上你电脑上文件夹的路径就可以了：cd test进入文件夹之后再使用sa...
2019-08-06 18:24:04
1308
原创 Sass教程二：Sass的安装
前面已经提到了，Sass是用Ruby语言开发的，所以在安装Sass之前，需要先安装Ruby 这里要注意几点： Mac系统是自带Ruby的，所以就不需要再次安装啦，所以下面安装Ruby的方法也只适用于Windows系统。 一些基于插件的编辑器，比如vsCode，Atom之类的，不需要安装sass，直接安装插件就可以进行编译。 Windows下安装Sass首先需要安装Ruby, 先从官...
2019-08-06 18:22:43
379
原创 Sass教程一：Sass概况
今天来聊聊sass吧，之前用了很久的less，刚开始接触的时候感觉这东西就是个神器，写css时间长了自然就能发现css在书写的时候的不足之处，不能嵌套，没有变量，更加不能像js那样用循环自动生成之类的，这些问题全部都被less解决掉了less加入了变量，加入了嵌套式写法，还有一大堆好用的功能，在这里就不多说了，今天要说的是sass。其实刚接触less的时候就知道有sass这个东西了，但是那...
2019-08-06 18:21:11
273
原创 前端小技巧（三）：愤怒的小鸟CSS版
先看效果：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .main{ width: 500px;...
2019-07-19 16:47:16
319
转载 整理 node-sass 安装失败的原因及解决办法
本文非原创，如有侵权请留言或发邮件告知，作者会立即停止侵权并删除本文。发布此文章主要是希望跟作者遇到同样问题的同学能解决node-sass 安装失败的问题。npm install 时偶尔遇到报错：没有安装python或node-sass 安装失败的问题，百度之后发现是被墙了，但根据百度的方法换了淘宝镜像和用了vpn都安装失败，最后发现原来是因为没有卸载之前安装失败的包导致的。作者本人最后的...
2019-04-15 16:01:25
6982
原创 元素居中的多种方法——css布局技巧（1）
经常碰到有同学在问，如何让一个元素上下左右都居中呢？ 相信大家在面试的时候也会经常碰到这个问题，一下列出来几种方式以供大家参考，如有不足之处，请大家补充问题描述：给定两个元素，这两个元素是父子级关系。并且两个元素的大小都是不确定的，那么这时候如何让子级在父级中上下左右都居中？（暂且设定父级比子级要大一些）第一种：利用定位先上代码及效果：<!DOCTYPE html>...
2019-03-29 15:52:36
455
1
原创 前端零基础入门（十一）：用css设置文字样式
经过前面的文章，相信大家已经基本了解了前端最基本的一些规则了：html搭建结构，承载内容 css则可以利用选择器，来为相应的html标签设置样式前面提到过的样式有最基础的盒模型相关属性：边框（border）以及 背景（background），有了这两个家伙之后我们基本上就能清楚的看到一个盒子的相貌了，那么现在我们就可以往里面添加一些内容了。最基础的内容当然是文字，当我们把文字放进标签里...
2019-03-29 14:47:15
496
1
原创 前端零基础入门（十）：css选择器二
接上回，在之前 “前端零基础入门（九）：css选择器一” 里面我给大家介绍了css最基础的几个选择器：ID选择器 类选择器 标签选择器 包含选择器 群组选择器这几个都是我们开发过程中会经常用到的选择器，比如css reset一般会用到群组选择器，正常的布局都用类选择器以及标签选择器，当然中间会出现包含关系。 然后某些特殊情况会用到群组选择器，至于ID选择器的话用得比较少一点，我们来看...
2018-11-20 18:28:01
292
原创 ES6系列（三）set和map
es6新增了几种数据结构：set和map。注意哦，是数据结构，不是数据类型！就好比数组，json等。一。Set它类似于数组，但是其成员的值都是唯一的，没有重复的值（甚至在Set内部，NaN和NaN是相等的）它在初始化的时候接受一个数组或者类数组作为参数，数组里的值将会做为set的成员：var s1 = new Set([1,2,3,5,6,7]);console.log(s1);/...
2018-11-05 15:17:59
204
1
原创 ES6系列（二）解构赋值
之前在我们开发的过程中，难免会碰到这样的问题：后端传给我们一串数据，然后我们需要对这个数据进行处理。如果是这样的一个数据：let obj = { username:'webpilot', userid:12831, profession:'webDeveloper', region:'beijing'}然后我们需要用变量去保存这些数据，那么我们可能会这么...
2018-10-31 14:12:03
313
原创 ES6系列（一）let和var的区别
在之前的js版本中，声明变量一直都是用var, 这个估计大家都很熟悉了，那么它的作用呢就是用来声明一个变量，比如像这样子：var a = 10;在这里我们就用var声明了一个变量a 并且在声明的同时给这个变量a赋值了 也就是10； 那么这时候如果我们去引用这个变量，那么得到的结果就是10，这没什么稀奇的，在这里就不再赘述了。那么在es6里面新增了两个声明变量的方法，一个是let，...
2018-10-23 18:04:58
233
原创 前端零基础入门（九）：css选择器一
最近很多同学问到选择器的问题，在这里给大家整理一下这一块的东西吧。那什么是css选择器呢? 简单理解一下：如果我们需要给某个html元素加上css样式的话，有三种不同的方法，这个在我之前的文章里面有说到过：《前端零基础入门（五）：如何在页面当中引用css样式》在这就不再一一赘述了。最常用的方法就是用外联样式，然后通过css选择器选择不同的元素，为其加上不同的样式。也就是说我们从...
2018-10-10 16:11:49
346
原创 前端零基础入门（八）：background的妙用_css精灵
在前面我们已经了解到了网页当中背景的基本用法了，包括：背景颜色，背景图片，背景图片是否重复，背景图片是否平铺等等基础样式。今天要和大家讨论的是背景图的一个稍微高级一点的用法：图片精灵（也叫：雪碧图，css精灵）。先来看一些大网站：这是淘宝，在这个地方就用到了雪碧图，再来看看这张图片是什么样子的再来一个：百度来看看这张背景图片：虽然我不太理解作为百度，居然会把...
2018-08-16 17:17:05
727
原创 JavaScript中的关键字和保留字
JavaScript把一些标识符拿出来用作自己的关键字。因此，就不能再在程序中把这些关键字用作标识符了：关键字：break delete function return typeofcase do if switch varcatch else in this vo...
2018-07-31 14:42:03
4208
转载 入门Webpack
写在前面的话阅读本文之前，先看下面这个webpack的配置文件，如果每一项你都懂，那本文能带给你的收获也许就比较有限，你可以快速浏览或直接跳过；如果你和十天前的我一样，对很多选项存在着疑惑，那花一段时间慢慢阅读本文，你的疑惑一定一个一个都会消失；如果你以前没怎么接触过Webpack，而你又你对webpack感兴趣，那么动手跟着本文中那个贯穿始终的例子写一次，写完以后你会发现你已明明白白的走进了...
2018-03-12 16:57:36
297
原创 前端小技巧（二）：评分效果css版
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .box{ width:205px; height:42px; position: relative;
2017-12-22 15:56:22
739
原创 前端零基础入门（七）：基础css样式之background
在一个网站中，文字，图片这些东西是必不可少的。文字可以直接敲在标签里面，就能够显示在页面上了。然而图片却不一样，图片是一个单独的文件，所以图片的引用会有所区别首先，如果想要在页面中显示一张图片，我们可以用两种引用方法 一种是直接用img标签，这个相对简单，在其他的快标签中插入img标签就可以了，没什么可说的 另外一种就是我们今天要说的，背景——background对于页面上用户能
2017-12-14 19:26:53
617
原创 工具：浏览器判断函数
function BrowserType() { var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器 var isIE = userAgent.indexOf("co
2017-10-20 18:56:37
315
原创 前端小技巧（一）：边框写三角形
边框写三角形，这个技能从事前端的小伙伴应该都不陌生，不过大多数都是知其然而不知其所以然，今天我们就来探究一下这里面的原理随意的在页面上给一个盒子，然后给一个边框来看看div{ width:100px; height:100px; border:10px solid #f00283;}这样的一段代码，给到盒子的宽高都是100像素，然后10个像素实线的红色边框，效果图如下，看起
2017-09-26 15:54:41
8004
原创 前端零基础入门（六）：基础css样式之border
上一节我们已经学习了如何在页面中使用css了，以及知道了一些简单的css样式，接下来我们还会更深入的学习一些别的css样式。以丰富我们的页面今天的这个样式叫做border，中文边框的意思 在我们的生活中，边框随处可见；比如窗户，门框等等，甚至我们现在看到的电脑屏幕四周的边也可以称之为边框 要在我们的网页当中应用边框非常的简单，就和之前我们用到的背景一样：<!DOCTYPE html><html
2017-09-22 17:57:39
2139
1
原创 前端零基础入门（五）：如何在页面当中引用css样式
上回我们已经完成了我们的第一个HTML页面了，但是这个HTML页面是不完整的，或者说仅仅只是一个页面而已，没有任何的样式，没有任何的修饰，也没有任何的功能。那么如何给页面加上一些修饰性的东西呢？ 就如同HTML最开始免费使用的时候一样，对页面的修饰需求越来越多，我们只能通过css来改变HTML的外观，让我们的网页更加美观，这样消费者才会买账。 那么在HTML页面当中使用c
2017-09-16 15:32:03
1104
原创 前端零基础入门（四）：第一个HTML页面
前面说到了html,css,js三者之间的关系 接下来我们就来看看html到底长什么样子。随便打开一个编辑器，然后在文件那里点击新建html文件，看到的代码大多如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body></body>
2017-09-12 17:30:46
878
原创 前端零基础入门（二）：前端开发都需要做什么？
随着前端在国内的火爆，可能很多人都听说了这么一个职位，入门简单，并且工资还不过，于是乎就开始摩拳擦掌，跃跃欲试。但是大部分人都不知道前端到底是做什么的，只知道和IT有关，和网站有关。 今天要来讨论的这个话题就是前端到底需要做什么，需要什么样的知识储备才能轻松应对这份工作。说道这个的话就不得不说说网站整体的开发流程以及参与开发的人员了。 这是一个最简单的网站从无到有的流程，当然这里面包含了
2017-09-11 12:31:04
1519
原创 前端零基础入门（三）：HTML，CSS，Javascript三者之间的关系
每个人接触前端的角度可能都不一样 有些人是以前从事web相关行业的，比如后端，比如设计。从事这些行业的人因为工作需要，多多少少都会对前端有一定的了解，不一定是这个词，但一定是这个职位 小白的话，可能更多的听到的是h5，css3之类的名词，其实无论从哪个角度接触到前端，不可避免的要了解前端的三大语言 HTML CSS Javascript今天咱们要说的就是这三大语言之一的HTML，翻译成中文，叫
2017-09-08 15:50:39
17967
4
简单Node后端代码
2020-12-08
AngularJS入门教程
2017-09-11
AngularJS开发指南.pdf
2017-09-11
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人