- 博客(30)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 前端base64适用场景
base64是网络上最常见的用于传输8Bit字节代码的编码方式之一，要求把每三个8Bit的字节转换为四个6Bit的字节，Base64是网络上最常见的用于传输8Bit字节代码的编码方式之一。图片文件在页面中可以用base64编码来展示。比如这样：<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAfCAMAAABEdrQOAAAAk1BMVEUAAABawfGL0qGl23Cl23Cl23Cl23Cl23Cl23Cl23
2020-05-18 14:47:40
671
原创 微信小程序 本地存储
我们知道，在HTML5中，新加入了localStorage本地存储功能，解决了cookie空间不足的问题（存储空间为4k），localStorage一般则支持5M的存储空间（不同浏览器中会有些不同）。微信小程序中也有本地存储的功能（最大为10MB），可以用来恢复小程序上次打开的状态，可以存储一些非实时数据用来加快页面渲染，减少用户等待时间。微信小程序中的数据有效期和localStorage相似...
2020-03-03 18:11:53
2579
原创 微信小程序 app.json
为了和上文做个联系与区别，app.json是对微信小程序进行全局配置。主要参数pages //页面路径列表 window //全局的默认窗口表现 tabBar ...
2020-03-01 17:27:44
446
原创 微信小程序 project.config.json
一、项目配置文件project.config.json小程序开发者工具在每个项目的根目录都会生成一个 project.config.json，在工具上做的任何配置都会写入到这个文件，当重新安装工具或者换电脑工作时，只要载入同一个项目的代码包，开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置，其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。可以在项目根目录使用 project...
2020-03-01 17:01:37
3015
原创 前端标签SEO优化
SEO是什么，SEO的工作原理啥的，我就不废话了。进入正题：页面标签对于SEO的优化。一、前端SEO要点1. css，js和html分离开发，精简代码，更有利于搜索引擎抓取有用的内容。2. “搜索引擎蜘蛛”不认识js，不认识flash，不会去爬iframe里的内容。3. 网站目录结构不宜过深，否则不利于搜索引擎抓取。4.页面关键词密度控制在2%~8%之间为宜。...
2019-12-29 19:25:21
2617
2
原创 背背背下http状态码（个人精简版）
我要背下http状态码，Because of interest 。http状态码是：用以表示网页服务器超文本传输协议响应状态的3位数字代码 ，所有状态码的第一个数字代表了响应的五种状态之一（摘自百度百科）1**信息，需要继续处理100客户端应当继续发送请求101 切换协议2**成功，成功接收并处理200 请求成功201已创建202已接...
2019-11-20 17:41:09
291
原创 ECharts“图例标记图形”样式调整
这两天的工作中，遇到一个ECharts方面的问题，需要把环形图“图例标记图形”隐藏掉，像下图这样。我用到的方法是，itemWidth：0。继续深入学习后发现，其中拥有的奥妙远不止于此。1. 隐藏“图例标记图形”ECharts中legend组件是对图例的说明，用来设置图例的相关样式。最初我用itmeWidth:0的方式可以说是一种变相隐藏。实际上图形的高度依然存在，依旧占据空间。（当然...
2019-11-13 13:09:25
5400
原创 美妙的css3动画库 animate.css
平常使用css3animation需要自己写动画效果，自己写呢效果僵硬，动作单一，就像机器人的一举一动。于是乎一个偶然的机会发现了美妙的css3动画库：animate.css，动画效果令人窒息！官方地址：https://daneden.github.io/animate.css/一、动画效果大致分为以下几类：Attention（晃动效果）bounce（弹性缓冲效果）fad...
2019-11-03 14:48:12
471
原创 CSS 单位 px、pt、em、rem
1. px (pixel，像素)：px即pixel(像素)，是相对长度单位，根据屏幕的像素决定，最能准确还原设计图。px是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI(Dots Per Inch，每英寸像素数)，在扫描打印时一般都有DPI可选。Windows系统默认是96dpi，Apple系统默认是72dpi。2. pt(point，磅)：pt...
2019-10-24 21:30:08
671
原创 npm源管理工具：nrm
众所周知，npm的全称为Node Package Manager，是一个基于Node.js的包管理器。但是由于“长城防火墙（中国国家防火墙）”的限制，造成了网络的诸多不便。乐于分享的阿里巴巴淘宝团队在境内搭建了服务器，用来实时同步npm的内容（10分钟同步一次），这就是cnpm淘宝镜像。然而国内有很多优秀的npm镜像，如果想使用这些不同的npm镜像，则每一个都需要单独安装并且会偶发性的踩坑，实在麻...
2019-10-19 16:36:03
657
原创 Vue笔记 — Vue生命周期
1. 组件创建阶段的4个钩子函数1.1 beforeCreate() 实例被完全创建之前执行1.2 create() 此时date和methods 已经初始化完毕1.3 beforeMount() 模板在内存中创建完成，但是没有渲染到页面中1.4 mounted() 内存中的页面已经挂载到页面，此时页面渲染完毕 ...
2019-09-29 20:06:53
167
原创 Vue笔记 — 事件修饰符
Vue.js 为 v-on 提供了 事件修饰符。通过由点 "." 表示的指令后缀来调用修饰符。一、stop（ 阻止冒泡）每当点击input，同时也触发了div的点击事件，当加上事件修饰符“.stop”后，冒泡事件就被阻止了。二、capture （添加事件侦听器时使用事件捕获模式）捕获事件和默认的冒泡相反，捕获从外向内。三、pr...
2019-08-14 22:58:08
578
原创 Bootstrap 下拉菜单dropdown、按钮组btn-group、导航元素nav、导航栏navbar
最近Bootstrap有点让我糊涂，在使用过程中，下拉菜单(dropdown)、按钮组(btn-group)、导航元素(nav)、导航栏(navbar)容易混淆，遂用闲暇时间琢磨琢磨（本文基于Bootstrap3）。这几者个人理解有点递进的意思：下拉菜单(dropdown)可以用在后3个中，组合起来可以称呼为：“按钮下拉菜单”或“导航下拉菜单”；按钮与导航之间没有“合作使用”价值，所以...
2019-07-31 20:39:59
5196
原创 Bootstrap3 和 Bootstrap4 的区别
Bootstrap3 Bootstrap4 Less预处理 Sass预处理 bootstrap3 共有4种栅格类，依次是： 特小(col-xs-) （<=768px） 小(col-sm-) （>=768px） 中(col-md-) （>=992px） 大(col-lg-)...
2019-07-14 23:21:16
5955
原创 canvas时钟
canvas是HTML5新增的组件，提供了新的javascript API。它最初由苹果内部使用自己MacOS X WebKit推出，供应用程序使用像仪表盘的构件和 Safari 浏览器使用。后来，有人通过Gecko内核的浏览器 (尤其是Mozilla和Firefox)，Opera和Chrome和超文本网络应用技术工作组建议为下一代的网络技术使用该元素。canvas就像是页面上的一块画布，而jav...
2019-06-02 14:55:46
950
1
原创 Vue.js核心思想
Vue.js核心思想包括2个方面：数据驱动和组件化。 1. 数据驱动：DOM是数据的一种自然映射（数据驱动DOM变化） MVVM框架示意图：Model对应javascript对象，View对应DOM结构，ViewModel将View和Model关联起来。Vue.js通过directive指令对DOM做封装，当数据发生变化，会通过指令修改相应的DOM...
2019-05-26 14:06:28
1314
原创 target="_blank" 安全漏洞
工作中，经常在<a>标签中添加target="_blank"，用来在新窗口打开页面，尤其是打开外链应用率几乎是100%。可是最近看到这竟然有一个巨大的安全隐患：比如在index.html中跳转到index2.html<a href="index2.html" target="_blank">link</a>在index2.html中添加一段js代码...
2019-04-26 17:34:02
1028
原创 git总结
最近在廖雪峰大神的官方网站学习了git，（原站链接：https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000），对分布式版本控制系统有了新的认识，在学习过程中整理的笔记如下：一 创建版本库mkdir ... //创建目录, 和linux命令一样...
2019-04-20 13:10:02
240
原创 display:table和display:table-cell实现单行，多行文本垂直居中
今天工作中遇到了一个问题，一个栏目的信息标题有长有短，短的一行，长的两行，但都要求垂直居中，像这样：一般的思路就是高度等于行高，但是这个仅适用于单行文本，flex布局也只是对元素可以设置垂直居中，不作用于文本。都不适用于像这个例子的，同一位置的不同场景。经过百度的指点，终于找到了比较完美的解决方法，那就是：结合使用display:table和display:table-cell，...
2019-03-11 22:54:22
28555
8
原创 css3 3D魔方
github地址:https://github.com/lishuai336/3D-mf/tree/master/3Dmfcss3强大的功能让人叹为观止，我们工作中接触到的都是皮毛，要想真正提升技术跟进前端的技术发展，靠自学才是出路。不过我倒是觉得学习是一件快乐的事情，在快乐中学习会事半功倍。最近看到了旋转的魔方小demo，便津津有味的琢磨起来，效果如图。对了，普及一下：在css3D...
2019-02-24 16:11:39
2101
1
原创 一个<i>标签实现动态太极图
最近看到一个小demo，一个<i>标签实现动态太极图，按照如下两张图片的样式，来回交替运动，感觉很是惊喜，我们工作内容都是政府类网站，平时很少能把这些css3属性结合起来使用。 body部分： <body> <i class="boxs"...
2019-02-16 12:17:27
2979
原创 DOCTYPE声明方式
工作了这么久不知道DOCTYPE的作用是什么，更不知道不同声明方式之间的差异，水平小菜凭这点一下就暴露了，惭愧惭愧！查阅文档整理如下：1. 标准模式与混杂模式由于历史发展的原因，不同浏览器对同一个页面的解析渲染是有差异的，没有统一的标准。1994年10月，万维网联盟（W3C）由 Tim Berners Lee 于美国MIT设立。截止2018年，W3C已发布了200多项影响深远的Web标准及...
2019-02-12 14:20:06
1244
原创 html htm shtml shtm关系
html（Hypertext Markup Language）即“超文本标记语言” 。先看下html历史。现在html已经发布到第五个版本。在1993年6月，HTML 由 IETF 工作小组发布草案，不过当时并不是一个成型的标准，暂且可以说他是第一版。两年后的1995年11月发布了html2.0，当时是作为RFC1866。（在RFC 2854于2000年6月发布之后被宣布已经过时）...
2018-12-21 19:43:35
373
原创 jQuery animate属性backgroundPositionY
诸如:$(selector).animate({"backgroundPositionY": "100px"}, 100);$(selector).animate({"backgroundPositionY": "20%"}, 100);可以设置元素背景图的纵坐标. 如果元素背景图纵坐标已经有了初始值, 那么我想通过animate在初始值的基础上控制背景图的位置, 该怎么操...
2018-09-04 20:14:41
995
1
原创 认识iframe
最近的工作经常能用到iframe标签, 到目前为止对iframe的特性了解甚少, 以至于在使用的时候难以得心应手, 遂利用周末的时间来学习一下.一. iframe是什么及作用iframe是嵌入式框架, 是html标签, 还是一个内联元素, iframe 元素会创建包含另外一个文档的内联框架（即行内框架) . 说白了, iframe用来在页面嵌入其他页面.二. iframe的优缺点...
2018-09-02 17:26:23
4276
3
原创 meta 标签
1.meta的作用mate标签（metadata元信息，描述信息的信息）都是以“名 / 值 ”对的形式实现，不会在页面显示，用于提供页面的相关信息，向浏览器提供渲染信息，搜索引擎优化（SEO），mate标签规定页面的描述，关键字，最后的修改日期，作者及其他信息等。2.meta的属性构成meta有可选属性（http-equiv="参数"和name=“参数”, scheme可选...
2018-08-29 20:48:55
1158
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人