- 博客(58)
- 收藏
- 关注
RSS订阅转载 css hack
什么是css hack 由于不同厂商的浏览器或者相同浏览器的不同版本（IE6-IE11，firefox，safari,opera,chrome等）对css的支持，解析不一样，导致在不同浏览器的环境中呈现出不一致的页面展现效果。为了统一的页面效果，需要针对不同的浏览器或者不同版本写特定的css样式，把针对不同浏览器/不同版本写相应的css code的过程，叫css hack！css hack原...
2018-05-08 09:57:16
309
原创 Vue2.0 render与react
vue2.0 添加了render函数和类似react的JSXvue2.0new Vue({ // components:{App} //vue1.0写法 render:(h)=>h(App)//vue2.0写法 }).$mount('#app') render:(h)=>h(App)解析如下 1. render:function (createElement){ ...
2018-04-02 09:45:12
841
原创 小程序button边框和背景色修改
一：button去掉边框border:none或border:0都无效因为小程序默认的样式中给button::after{content:""}自行添加button::after{border:0}去掉button的边框二：button disable之后背景颜色和字体颜色的值都是默认的。如何修改disable的背景颜色和字体颜色因为小程序给了button
2018-01-22 15:11:12
36339
原创 Flex实例
一:flex-flow(是flex-direction属性和flex-wrap属性的简写) flex-flow .parent{ width: 100px; height: 100px; background-color: #ccc; display: flex; margin-bottom: 20px; } .box1{
2017-06-01 14:33:45
429
原创 vue2.0 组件
一：什么是组件组件（component）是vue.js最强大的功能之一。组件可以扩展html元素，封装可重用的代码。在较高层面上，组件是自定义元素，vue.js的编译器为它添加特殊功能。在有些情况下，组件也可以是原生html元素的形式，以is特性扩展。二：使用组件1.组件全局注册 // 注册 Vue.component('m
2017-05-19 18:03:02
929
原创 js监听浏览器关闭事件 onbeforeunload和Onunload不生效 使用onpadehide可以监听到浏览器关闭事件
刷新页面时onbeforeunload和Onunload都不生效一：onbeforeunload is work 没有alert出来，事件触发了，因为页面跳转的时候，window对象和DOM对象都已经被销毁了，所有alert不能执行如果在事件里面加上一段ajax请求是可以执行的，但是ajax请求一部返回就不一定能执行到。 window.onbeforeunload = function
2017-04-26 16:12:56
2227
转载 tranform值transform-origin
transform-origin属性默认情况，变形的原点在元素的中心点，或者是元素X轴和Y轴的50%处。如果把transform-origin原点设置为 0 ，0，这个时候元素的变换原点转换到元素的左顶角处。transform-origin取值与background-position取值类似。top = top center = center top = 50%
2017-03-24 18:34:22
1626
原创 css过渡transition
一：定义transition是一个复合属性，包括transition-property,transition-duration,transition-timing-function,transition-delay四个子属性。 transition-property:过渡属性（默认值为all,就是所有属性一起过渡）transition-duration:过渡持续时间（默认为0s,一定
2017-03-21 17:11:10
412
原创 不定宽块级元素水平居中
一：看了慕课网有3种居中方式1：将要居中的元素加入到table标签中的td标签里面2：将块级元素设置成内联元素，display:inline3: 设置父元素position:relative ，display:inline-block,margin-left:50%,子元素margin-left:-50%二：将要居中的元素加入到table标签中的td标签里面主要
2017-03-17 18:54:43
332
转载 webpack基础入门(四)
加载图片试试加载图片,首先第一件事情就是安装对应的loader。它会将样式引用到的图片转为模块来处理。npm install url-loader --save-dev当然你也可以在package.json添加依赖，然后再npm install 一样的效果
2017-01-12 15:41:02
458
转载 webpack基础入门(三)
了解webpack配置webpack在执行的时候，除了在命令行传入参数，还可以通过制定的配置文件来执行，默认情况下，会搜索当前目录的webpack.config.js文件。这个文件是node.js模块，返回一个json格式的配置信息对象，或者通过 --config选项来执行配置文件。现在仅仅需要运行webpack了解webpack.config.js参数意义entry:值入
2017-01-06 11:50:18
249
转载 webpack基础入门(二)
loader介绍Loader可以理解为是模块和资源的转换器，它本身是一个函数，接受源文件作为参数。返回转换的结果。这样，我们就可以通过require来加载任何类型的模块或文件，比如vue jsx sass loader使用安装安装用来读取css文件的css-loader，再用style-loader把它插入到页面中npm install css-loader style-lo
2017-01-05 16:29:46
220
转载 webpack基础入门(一)
一：前提1：官网：https://github.com/webpack/webpack2：参考文章url: http://blog.guowenfh.com/2016/03/24/vue-webpack-01-base/二：安装安装nodeJs和npm：因为webpack是基于node的项目，所以首先需要安装node.js 官网：http://nodejs.cn/，和npm，新
2017-01-05 14:02:05
297
转载 vue2.0生命周期
{{data}}var myVue = new Vue({el:'#app',data:{data:'aaaa',info:'nono'},beforeCreate:function(){console.log('创建前=======')console.log(this.data)console.log(this.$el)},create
2017-01-04 14:17:15
3316
原创 上传文件或图片 type=file change事件只触发一次
原因：该问题并不是由change事件失效造成的，而是ajaxFileUpload插件造成的，它会把原来的file元素替换成新的file元素，所以之前绑定的change事件就失效了，需要重新绑定一下1.替换掉原来的input框2.remove原来的input框，然后在添加进新的一样的input框3.重新绑定change事件。htmlinput type="file"
2016-12-27 11:52:18
8900
原创 CORS跨域原理
CORS跨域原理：CORSajax请求设置ORigin服务器通过设置Access-Control-Allow-Origin来进行，如果浏览器检测到相对应的设置，就可以允许ajax进行跨域的访问。客户端：functiongetHello() {varxhr = newXMLHttpRequest();xhr.open("post
2016-11-29 18:35:45
625
原创 垂直水平居中
一：水平居中方式：1.margin:0 auto;水平居中，设置块元素的居中。必须要设置width，并且元素不能设置成position:absolute; .parent{ width: 300px; height: 200px; margin: 0 auto; color: #FFF; background: #5
2016-11-09 14:51:43
273
原创 this指向问题
一：this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象实例一：函数this指向function a(){ var user = "sly"; console.log(this.user); console.log(this); }a();//undefined //Wind
2016-11-08 17:54:02
258
原创 面试题整理
1.正则表达式（邮箱）邮箱校验/^([0-9A-Za-z_-])+@([0-9A-Za-z]_-)+((.[a-zA-Z0-9_-]){2,3}){1,2})$/2.浏览器url获取参数和值window.location对象，包含当前URL的信息。属性href整个url字符串。location.protocol 含有url的第一部分的字符串。如http:lo
2016-11-04 15:09:59
389
原创 less sass与css区别.
sass/less比css多出的功能{1.变量，Less-作用域如@color：#00c;#header{@color:#c00;/*red*/border:1px solid @color;/*红色边框*/}#footer{border:1px solid @color;/*蓝色边框*/}就相当于js里面设置全局变量和局
2016-11-01 18:47:05
3980
原创 响应式布局 css3 media 媒体查询 和js+rem
一：媒体查询1.使用media的时候需要先设置标签来兼容移动设备的展示。metaname="viewport"content="width=device-width,user-scalable=no,initial-scale=1, minimum-scale=1, maximum-scale=1"> width=device-width :宽度等于当前设备的宽度use
2016-10-31 14:43:19
5223
原创 iscroll踩过的坑
在iscroll在使用之前必须要实例化，document.getElementById("wrapper").addEventListener('touchmove', function (e) { e.preventDefault(); }, false);document.addEventListener('DOMContentLoaded', function () { s
2016-10-14 16:36:52
5246
1
转载 CSS3 box-sizing 属性
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}一：box-sizing:content-box;默认值，W3C标准盒子模型，元素的宽度和高度等content+padding+border。css中设置的width就是设置的content的宽高，不包含border和paddi...
2016-08-10 17:49:14
292
转载 css 垂直居中
参考：http://www.cnblogs.com/dojo-lzz/p/4419596.html凡是table布局可以实现的，css一定可以实现。css可以实现的，table未必能做到一：单行元素垂直居中只考虑单行是简单的，无论是否给容器固定高度，只要给容器设置line-height和height，并且两指相等，再加上over-flow:hidden.单行文本垂直居中，lin
2016-08-07 16:38:37
230
原创 css 水平居中
一:水平居中水平居中分为4种：块级元素，内联元素，宽度确定，宽度不确定1.宽度确定的块级元素margin:0 auto确定宽度的margin水平居中.warp1{width: 300px;height:300px;margin: 10px auto;border: 1px solid #fecdea;}2.不确定宽
2016-08-07 15:46:39
280
原创 html5发送语音问题及解决方案
需求：html5能发语音1.考虑原生的webRTC参考地址：http://www.cnblogs.com/jscode/p/3601648.htmlnavigator.getUserMedia({ video: true, audio: true}, onSuccess, onError);但是webRTC需要的请求一定是https
2016-08-04 19:13:56
5525
原创 手机网页如何取消常按选中功能和touchstart后不能触发touchend事件
/**禁用长按选中文本功能 start*/* { -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}/**禁用长按选中文本
2016-08-04 18:53:33
4346
转载 移动端web开发，click touch tap区别
移动端用tap时会有穿透问题一：click与tap比较click与tap都会触发点击事件，但是在手机web端，click会有200-300ms的延迟，所以一般用tap代替click作为点击事件。singleTap 和doubleTap分别代表单次点击和双次点击二：tap的穿透处理使用zepto框架的tap的点击事件，来规避click事件的延迟响应，会出现穿透，即点击会触发非当前层的
2016-06-17 17:58:25
15835
原创 glup搭建和使用
简介：Gulp是前端开发过程中对代码进行构建的工具，是自动化项目的构建利器；不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成；使用gulp，不仅可以很愉快的编写代码，而且大大提高工作效率Gulp是基于nodejs的自动化任务运行器。能自动化地完成JavaScript，coffee，sass，less，html，image，css等文件的测试，检查，合并，压
2016-05-05 14:01:54
2743
原创 editor操作不生效处理
var ue = UE.getEditor('editor');ue.addListener("blur",function(){//方法})addListener是让编辑器加载完成，因为有时操作时编辑器还没加载完成操作不了
2016-04-29 18:34:33
745
转载 px em rem关系
一：px（像素）px和屏幕分辨率关系1.显示分辨率就是屏幕上显示的像素个数，而像素是指能单独显示颜色的最小单位2.计算机屏幕上显示多少信息的设置，以水平和垂直像素来衡量3.分辨率1600*900的意思是水平方向含有像素数为1600个，垂直方向像素数900个。屏幕尺寸一样的情况下，分辨率越高，显示效果就越精细和细腻。4.画面是由许多的像素点组成，而画质的细腻就是由点距来决定的，点
2016-04-18 11:57:21
307
转载 link和@import的区别
页面中使用CSS的方式主要有3种：行内添加定义style属性值，页面头部内嵌调用和外面链接调用，其中外面引用有两种link和@import<link rel="stylesheet" rev="stylesheet" href="CSS文件" type="text/css" media="all" /> @import url("CSS文件");
2016-04-11 12:00:19
170
转载 IE盒子模型和标准盒子模型区别
一：标准盒子和IE盒子模型标准盒子模型，content不包含padding和border非IE盒子模型：content包含content，padding，border标准盒子模型的高：height=(margin-top+margin_bottom)+(border_top+border_bottom)+(padding_top+padding_bottom)+cont
2016-04-11 11:45:51
804
转载 js的全局变量和局部变量
一：var a ="1";function test(){var a;alert(a);var a="2";alert(a);}test();//undefined ; 2alert(a);//1var a ="3";function test(){alert(a);var a="4";alert(a);}test()
2016-04-05 18:37:38
377
原创 面试题整理 二
一：addEventListener(event,function(){},useCapture)作用addEventListener(event,function(){},useCapture)中useCapture可选，boolean值，指定事件是否在捕获或者冒泡阶段进行，true事件在捕获阶段，false默认为false，事件在冒泡阶段二：js事件的冒泡和捕获事件冒泡：事件从
2016-04-05 17:28:38
207
原创 js字符串拼接效率
在脚本开发过程中，经常会按照某个规则，组合拼接出一个大字符串进行输出。比如写脚本控件时控制整个控件的外观的html标签输出，比如ajax里得到服务器端的回传值后动态分析创建html标签时。方式一：字符串的拼接在我们写代码时用“+=”这个运算符，s += string;这种方式脚本执行起来很慢，CPU使用率狂高。方式二：使用数组var content =[];co
2016-04-05 14:55:46
607
原创 浏览器cookie的操作
一：获取浏览器cookiedocument.cookie获取当前浏览器cookie中所有的键值对。获取的是所有键值对的string，每个键值对以“;”function getCookie(objName) { //获取指定名称的cookie的值 var arrStr = document.cookie.split("; ");for (var i = 0; i va
2016-04-05 14:17:32
237
转载 window.location.hash属性介绍
location是JavaScript管理地址栏的内置对象，比如location.href管理页面的url，用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash = '#admin'。利用这个属性值可以做一个非常有意义的事情。很多人喜欢收藏
2016-04-05 11:54:08
276
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人