- 博客(40)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 纯CSS实现多行文本溢出显示省略号（兼容不同浏览器）
1、单行文本溢出显示省略号单行文本溢出显示省略号比较简单，设置white-space: nowrap避免换行，再设置text-overflow: ellipse即可。 <style> .single-line { width: 200px; line-height: 1.4; white-space: nowrap; overflow: hidden...
2019-09-28 00:06:29
4835
原创 移动web开发入门—基础知识、自适应布局、调试
之前没做过移动端web开发，最近接手的一个小项目是做微信公众号，需要考虑手机适配。UI给出的设计稿是一般是基于iphone手机做的（15年之后是基于ipone6），我们的UI是基于iphone6来做的（iphone6手机的分辨率是1334 * 750）。开发过程中主要有几个疑问：1、如何将设计稿的尺寸转换到开发尺寸？2、如何实现自适应？3、如何调试在手机中的展示效果下面会针对这几个问题展开...
2019-07-21 20:01:56
643
原创 前端构建工具gulp使用教程（二）、常用gulp插件以及gulp使用完整实例
gulp的插件数量虽然没有grunt那么多，但也可以说是应有尽有了，下面列举一些常用的插件。一、常用插件使用说明1、自动加载插件使用gulp-load-plugins。详细教程请参考https://github.com/jackfranklin/gulp-load-plugins安装：npm install --save-dev gulp-load-plugins要使用gulp的插...
2019-04-14 11:16:15
1319
原创 前端构建工具Gulp使用教程（一）、gulp安装以及基础API介绍
前言、gulp和grunt比较gulpjs是一个前端构建工具，与gruntjs相比，gulpjs无需写一大堆繁杂的配置参数，API也非常简单，学习起来很容易，而且gulpjs使用的是nodejs中stream来读取和操作数据，其速度更快。工作方式差异：Grunt主要是以文件为媒介来运行它的工作流的，比如在Grunt中执行完一项任务后，会把结果写入到一个临时文件中，然后可以在这个临时文件内容...
2019-04-14 11:15:55
695
原创 Axure使用教程（二）、动态面板
动态面板可以设置多个状态，可以通过设置动态面板在不同状态间切换来实现复杂功能。比如弹出框、下拉菜单、轮播等。一、如何创建、编辑、取消动态面板1、从左侧部件库中拖进一个动态面板来。2、双击动态面板，可以编辑动态面板。如下图，出现动态面板弹出框，可以命名动态面板名称。另外选中State，点击可修改状态名称，双击可进入State编辑状态。如果需要新增状态，点击下图中的加号。3...
2019-04-06 11:24:44
26411
3
原创 Axure使用教程（三）、母版、Chart图表元件库
一、母版在项目中使用母版能大幅提高重复劳动的工作效率，特别是在需求产生变更调整原型的时候。适用于网站导航、菜单等1、新增母版在左侧可以找到母版区域，可以新增母版、母版文件夹。2、母版使用如果页面需要使用母版，有两种方法。第一种是打开页面，将母版拖放进去。第二种方法是选中母版，右键选择Add to Pages，这种方式可以实现批量添加。母版有三种拖放行为：任意位置、固定位置、脱离母版。“任...
2019-04-06 10:33:55
11949
6
原创 Axure使用教程（一）、下载和基本使用
一、Axure下载下载链接（在软件目录下）：https://pan.baidu.com/s/12WgOKt8PFr4BsfiuNJ0XFA提取码：yp4w二、Axure基本使用软件基本使用可以通过Axure官网上的PPT来学习。原文地址：https://www.axure.com.cn/337/或者通过我上面的云盘地址来下载（在软件教程目录下）。下面主要总结下学习过程中认为相对...
2019-03-23 18:11:35
55354
10
原创 chrome内存泄露（二）、内存泄漏实例
一、常见JS内存泄漏1.1 全局变量引起的内存泄漏 全局变量使用完毕没有置为null导致内存就无法回收。平常应注意不要引入意外的全局变量，比如定义变量记得加 var声明。 全局变量引发泄露的实例：<button onclick="createNode()">添加节点</button> <button onclick="removeN...
2018-12-09 16:57:10
8588
2
原创 sikulix安装
我安装的是sikulix1.1.3版本。需要安装JDK和sikulix。可以参照下面的教程下载，也可以直接到我的百度云盘里下载jdk-8u191-windows-x64.exe和sikulixsetup-1.1.3.jar。提取码是mpwx。1、安装jdk 安装sikulix之前先装好jdk环境。sikulix要求jdk8.0+。1）下载JDK 搜索“JDK官方下载...
2018-12-08 23:35:11
5316
4
原创 chrome内存泄露（一）、内存泄漏分析工具
内存分析使用的工具包括chrome任务管理器、chrome时间轴（低版本是Timeline，高版本对应performance）、chrome memory（低版本是chrome profiles，主要用JS堆快照、JS堆动态分配时间轴）。文中分析所用chrome版本是68。使用Chrome任务管理器，了解网页使用的内存量。 使用时间轴记录可视化内存使用。 使用堆快照标识分离的DOM...
2018-12-02 16:18:27
50016
4
转载 nodeJS教程（三）、为npm设置http代理
由于公司电脑没法上网，通过虚拟上网环境才能上网。所以在电脑上没法通过npm安装模块，要先设置http代理。1、设置全局代理set https_proxy=http:代理：端口 eg:set https_proxy=http:10.172.115.85:2145(这是例如，具体设置成为自己的代理和端口)set http_proxy=http:代理：端口 eg:set http_prox...
2018-10-04 22:44:53
5633
原创 nodeJS教程（二）、nodejs调试
一、基于nodejs内建的调试node.js本身支持调试，在js文件中加上debbuger或者在cmd中通过setBreakpoint()可以添加断点。要使用nodejs的调试服务，只要在启动命令时加上debug。如：node debug web.js。这时候输入一些指令就能够单步调试、监视变量。命令 功能 backtrace, bt 显示当前的调用栈 cl...
2018-10-04 19:19:30
459
原创 nodeJS教程（一）、nodejs安装
一、下载安装首先到官网上https://nodejs.org/en/#download 下载安装包。点击安装包后，基本上都是点击下一步，所以就不多讲。二、安装必备模块安装完之后打开尝试运行程序，可能会提示缺少的模块，比如：Error: Cannot find module 'mime'//表示缺少mime模块Error: Cannot find module 'socket.io...
2018-10-04 15:46:43
1519
原创 requireJS教程（一）
requireJS下载：https://requirejs.org/一、requireJS作用1）实现js文件的异步加载，避免网页失去响应；2）管理模块之间的依赖性，便于代码的编写和维护。实现代码模块化什么是模块化？模块就是实现特定功能的一组方法。只要把不同的函数（以及记录状态的变量）简单地放在一起，就算是一个模块（但这种方式的模块化缺点明显）有了模块，能够方便地引用别人的代码。nodejs的诞生...
2018-07-16 12:32:02
26499
转载 git安装
原文地址: https://blog.csdn.net/exlsunshine/article/details/189393291、从git官网下载windows版本的git：http://git-scm.com/downloads。如果官网太慢，可以选择csdn下载。https://download.csdn.net/download/zzfenglin/96813432、一般使用默认设置即可：...
2018-04-15 16:50:39
247
转载 Node.js 命令行程序开发教程
本文大部分是参考阮一峰的文章，只是额外记录在windows下尝试的笔记。原文地址：http://www.ruanyifeng.com/blog/2015/05/command-line-with-node.html。我在windows系统试了下，有些地方感觉和原文不一样，不知道是不是自己理解不到位，还是因为系统不同的缘故。我的nodejs安装目录是D:\nodejs，在下面创建了个项目test。把...
2018-04-15 15:28:40
1780
1
转载 JS和CSS执行顺序
一、脚本和样式表加载、执行顺序总结1、脚本web的模式是同步的，开发者希望解析到一个script标签时立即解析执行脚本，并阻塞文档的解析直到脚本执行完。如果脚本是外引的，则网络必须先请求到这个资源——这个过程也是同步的，会阻塞文档的解析直到资源被请求到。这个模式保持了很多年，并且在html4及html5中都特别指定了。开发者可以将脚本标识为defer，以使其不阻塞文档解析，并在文档解析结束后执行。...
2018-04-08 20:42:28
6394
原创 overflow:hidden不会隐藏所有子元素
1、overflow:hidden不会被隐藏的情况拥有overflow:hidden样式的块元素内部的元素溢出有时候不会被隐藏。当同时满足以下条件：拥有overflow:hidden样式的块元素不具有position:relative和position:absolute样式；内部溢出的元素是通过position:absolute绝对定位，并且该定位元素的包含块是设置overflow:hidden元...
2018-04-03 20:19:43
9129
转载 html5中的meter标签改变颜色规则
一、meter标签改变颜色规则 meter 标签的max、min属性定义在最两边，low和high定义在中间。这样分割开了3个区：[min,low)、[low,high]，(high,max]。最佳值 optimum 和 value 的不同决定了显示的颜色的不同。最佳值默认是1/2(min+max)。规则：和 optimum 值在同一个...
2018-04-03 19:39:03
8022
原创 常用插件二、全屏插件fullPage.js
fullPage的github下载地址：https://github.com/alvarotrigo/fullPage.js。github上包含了很多的案例。文档也是参考github的使用说明fullPage demo：http://www.dowebok.com/demo/143/一、fullPage引入和使用1、引入插件全屏插件fullPage.js依赖jQuery。我下载的是fullPage...
2018-03-31 23:06:13
5735
原创 IE8图片不能显示
1、背景图片不能显示background:url(img/img1.jpg)no-repeat;background:url(img/img1.jpg) no-repeat;第一个背景图片IE8下不会显示，第二行代码的背景图片会显示，区别在于no-repeat前面的空格，IE8对空格的敏感度很高。2、图片色彩模式为CYMKBrowserRGBCMYKIE6, 7, 8YesNoIE9YesYes...
2018-03-30 22:13:38
822
转载 IE中CSS-filter滤镜小知识大全
本文转载，并做了部分修改。原文链接https://segmentfault.com/a/1190000002433305。前言前段时间在做一个专题的时候用到了opacity不透明度属性，因为设计图上是半透明背景，白色文字有时候我们很习惯的用到不透明属性opacity来增加层次感或者增加用户体验，但因这个属性是css3属性，不兼容IE8及其以下版本。一般要尽可...
2018-03-22 22:54:12
6945
原创 三栏布局的7种解决方案
写出三栏布局，左栏宽度190、右栏宽度300px，中间宽度自适应。 1、浮动布局1）解决方法浮动方案是通过将左边栏、右边栏设置定宽、浮动，中间栏通过margin-left、margin-right来确定位置、宽度。<head><meta charset="utf-8"><title>文档标题</title><style>.cont...
2018-03-18 21:54:38
515
原创 常见样式问题八、对行内元素、line-height、vertical-align的理解
一、行内元素基本术语匿名文本：所有未被包含在行内元素的字符串。内容区：非替换元素中，内容区是元素中各字符的em框描述的；替换元素中，内容区是指元素的固有高度再加上可能有的外边距、边框、或内边距。em框：em框在字体中定义，也称字符框。em框不一定指示字体中字符建立的任何边界。有可能小于或者大于字符。它指示如果没有额外行间距设置字体时基线间的距离。某种字体的字符有可能比默认的基线间距离要高（即字符比...
2018-03-17 17:31:22
3221
原创 常见样式问题七、word-break、word-wrap、white-space区别
首先推荐下MDN网站，在上面可以学习html、css、js。对于css而言，可以查看详细的语法、使用案例、浏览器兼容性。附上链接：https://developer.mozilla.org/zh-CN。一、基本介绍1、word-breakMDN上显示语法：normal | break-all | keep-all | break-word值：normal：使用默认的断行规则。break-all...
2018-03-12 23:00:21
8402
原创 normalize.css分析
本文主要获取网上normalize.css的v8.0.0版本，记录自己对设置样式的理解可以在github上下载normalize.css文件：https://github.com/necolas/normalize.css/releases1、-webkit-text-size-adjust属性该属性最先是由 iOS 1.0 引入的，所以本来就是解决移动设备上的问题而出现的。通常 iPhone（i...
2018-03-11 23:04:57
926
原创 常见样式问题六、CSS长度单位（px、em、rem等）及相关内容
一、基本长度单位1、相对长度单位px：像素。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。同样尺寸的屏幕，分辨率越大，像素的物理尺寸越小（分辨率=屏幕横向的像素数量 *屏幕纵向的像素数量。所以像素大小 = 屏幕尺寸^2 / 分辨率）。windows系统使用的分辨率一般是96像素/英寸。而mac的用户所使用的分辨率一般是72像素/英寸。ex：所有字体中小写x的高度。目前很多用户代理会将1/2...
2018-03-10 22:02:14
880
原创 常见样式问题五、表格宽度自动计算规则
表格注意点：如果表格单元width为数值，width表示的是content的宽度；如果表格单元width为百分比，width表示的是content + padding + border的宽度。表格border-collapse为collapse时，各列含border的列宽之和 >= 实际表格宽度。固定布局的表格，只有首行的列设置的宽度有效，第二行及之后设置的宽度不起作用；自动布局的表格，所有...
2018-03-07 23:22:36
2580
原创 常用插件一、chosen插件使用及优化
1、插件介绍Chosen 是select下拉框美化插件，它能让丑陋的、很长的select选择框变的更好看、更方便。此外，还可以搜索查找下拉选项。它可对列表进行分组，同时也可禁用某些选择项。chosen插件下载和教程：https://harvesthq.github.io/chosen/。chosen插件的选项：https://harvesthq.github.io/chosen/options.h...
2018-03-06 23:54:51
22933
1
原创 leetcode_13. Roman to Integer
1、算法题目 要求将罗马数字转换为整数2、罗马数字规则罗马数字表示法基本字符有7个：I，V，X，L，C，D，M，分别表示1，5，10，50，100，500，1000。在构成数字的时候，有下列规则：相同的数字连写，所表示的数等于这些数字相加得到的数，如：Ⅲ = 3；小的数字在大的数字的右边，所表示的数等于这些数字相加得到的数， 如：Ⅷ = 8；Ⅻ = 12；小的数字，在大的数字的左边，所表示的数等...
2018-03-06 18:29:05
141
原创 常见样式问题四、利用:after、BFC清除浮动
一、为什么要清除浮动元素浮动后，该元素就会脱离文档流，浮动在文档之上。在CSS中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。当元素浮动之后，不会影响块级元素的布局，只会影响内联元素布局。此时文档流中的普通流就会表现得该浮动框不存在一样的布局模式。没有清除浮动会出现高度塌陷（包含框的高度小于浮动框）、包含块下的非浮动元素和浮动元素会发生重叠。先看下未设置浮动效果，代码如下...
2018-03-05 23:02:01
314
原创 常见样式问题三、margin、padding百分比
1、margin百分比介绍可以对元素的margin设置百分数，百分数是相对于父元素的width计算，不管是margin-top/margin-bottom还是margin-left/margin-right。（padding同理）。如果没有为元素声明width，在这种情况下，元素框的总宽度包括外边距取决于父元素的width，这样可能得到“流式”页面，即元素的外边距会扩大或缩小以适应父元素的实际大小...
2018-03-04 23:35:05
631
原创 常见样式问题一、水平居中和垂直居中
一、水平居中1、行内元素（text-align:center）（适用：行内元素，或类行内元素（如文本）。包括inline/inline-block/inline-table/inline/flex 等类型的元素实现居中。）行内元素水平居中，可把行内元素嵌套在水平居中的块状元素中。<style>.container{width:800px; background-color:#f6f6...
2018-03-03 23:13:50
332
原创 常见样式问题二、CSS实现普通三角形、空心三角形
1、初识css三角形第一次知道CSS实现的三角形是在bootstrap源码中看到。bootstrap泡泡提示框的空心三角形就是用css实现的。下面是bootstrap v3.3.6中跟空心三角形相关的代码：.popover > .arrow,.popover > .arrow:after { position: absolute; display: block; widt...
2018-03-03 13:52:29
2754
原创 leetcode_8. String to Integer (atoi)
/** * 提取字符串中的整数。如果字符串开头空白字符，则忽略。从第一个不是空白字符的位置开始提取整数。注意整数前面可能有+、-号 * @param {string} str * @return {number} */var myAtoi = function(str) { var result = 0; i = 0; while(str[i] == ' ') ...
2018-02-28 21:28:10
133
原创 leetcode__7. Reverse Integer
/** *整数逆序求值 * @param {number} x * @return {number} */var reverse = function(x) { var result = 0; while(x != 0) { result = result * 10 + x % 10; x = Math.floor(x / 10);...
2018-02-28 19:42:39
127
原创 leetcode_4、Median of Two Sorted Arrays
var findMedianSortedArrays = function(nums1, nums2) { if(nums1.length > nums2.lenth) { var tmp = nums2; nums2 = nums1; nums1 = tmp; } var len1 = nums1.length, ...
2018-02-28 19:30:08
111
原创 html多重引号嵌套
html中有多层引号嵌套，就会导致字符串被截取等问题 引号嵌套两层时，可以使用转义或者单双引号交替的形式实现，当引号嵌套达到三四层的时候，问题就出现了。 比如下面这段是嵌套三层时的正确写法（双引号嵌套单引号，单引号又嵌套转译单引号）：function execScript(code){ var script = document.createE
2017-06-03 10:34:29
4498
转载 js匿名函数括号的作用
原文链接：js中(function(){…})()立即执行函数写法理解 详细解释请看原文。我觉得还是挺有帮助的。我主要摘抄了部分主要内容，加了部分自己的理解： ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法，最初我以为是一个括号包裹匿名函数，再在后面加个括号调用函数，最后达到函数定义后立即执
2017-04-09 10:32:28
2256
转载 $POST 、$HTTP_RAW_POST_DATA、php://input三者之间的区别
原文链接：https://segmentfault.com/a/11900000037077281、$_POST $_POST是我们最常用的获取POST数据的方式，它是以关联数组方式组织提交的数据，并对此进行编码处理，如urldecode，甚至编码转换，识别的数据类型是PHP默认识别的数据类型 application/x-www-form-urlencoded 要
2017-03-29 21:30:53
429
JS内存泄露demo
2018-12-09
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人