<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[leadn的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/leadn</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; leadn]]></copyright><item><title><![CDATA[webpack的5个基本概念]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/80959451</link><guid>https://blog.youkuaiyun.com/leadn/article/details/80959451</guid><author>leadn</author><pubDate>Wed, 26 Dec 2018 10:52:38 +0800</pubDate><description><![CDATA[ 

1.webpack是什么

webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。

2.基本概念

1）.入口起点(entry point)   

指示...]]></description><category></category></item><item><title><![CDATA[npm 用法]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/80959272</link><guid>https://blog.youkuaiyun.com/leadn/article/details/80959272</guid><author>leadn</author><pubDate>Sun, 08 Jul 2018 15:06:17 +0800</pubDate><description><![CDATA[1.为什么使用npm       方便快捷使用包2.怎么安装     下载nodejs   下载地址3.常见命令行  npm  -v                                  查看版本         install                            下载安装                                              -g...]]></description><category></category></item><item><title><![CDATA[yarn基础用法]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/80958961</link><guid>https://blog.youkuaiyun.com/leadn/article/details/80958961</guid><author>leadn</author><pubDate>Sun, 08 Jul 2018 14:42:01 +0800</pubDate><description><![CDATA[1.为什么用yarn快捷（可以离线安装本地modules）、安全（在安装前会检查包是否出错）、可靠（不受电脑环境影响）2.如何安装   window可以使用官方地址msi下载安装，也可以通过 npm install yarn -g    yarn --version    查看是否安装成功3.常用命令yarn-h                  命令提示yarn-init            ...]]></description><category></category></item><item><title><![CDATA[时间戳转成特定格式]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78913349</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78913349</guid><author>leadn</author><pubDate>Wed, 27 Dec 2017 16:07:36 +0800</pubDate><description><![CDATA[function getLocalTime(uData) {
        var myDate = new Date(uData * 1000);
var year = myDate.getFullYear();
var month = myDate.getMonth() + 1;
var day = myDate.getDate();
var hours = myDate.getH]]></description><category></category></item><item><title><![CDATA[classList介绍和原生JavaScript实现addClass、removeClass等]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78913327</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78913327</guid><author>leadn</author><pubDate>Wed, 27 Dec 2017 16:05:39 +0800</pubDate><description><![CDATA[使用jQuery可以给元素很方便的添加class和删除class等操作，现在原生的JavaScript也可以实现这个方法了。使用classList可以方便的添加class、删除class、查询class等。

语法：

let elementClass = element.classList;


elementClasses 是一个 DOMTokenList 表示 element ]]></description><category></category></item><item><title><![CDATA[CSS 外边距(margin)重叠及防止方法]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78911085</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78911085</guid><author>leadn</author><pubDate>Wed, 27 Dec 2017 13:25:03 +0800</pubDate><description><![CDATA[CSS 外边距(margin)重叠及防止方法



边界重叠是指两个或多个盒子(可能相邻也可能嵌套)的相邻边界(其间没有任何非空内容、补白、边框)重合在一起而形成一个单一边界。


两个或多个块级盒子的垂直相邻边界会重合。结果的边界宽度是相邻边界宽度中最大的值。如果出现负边界，则在最大的正边界中减去绝对值最大的负边界。如果没有正边界，则从零中减去绝对值最大的负边界。注意：相邻的盒子可]]></description><category></category></item><item><title><![CDATA[手机端H5获取当前城市的方法]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78815901</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78815901</guid><author>leadn</author><pubDate>Fri, 15 Dec 2017 18:47:18 +0800</pubDate><description><![CDATA[移动端的H5页面提供了定位的功能，那么如何实现一个最简单的需求-----获取用户当前城市？

你可能搜一下就会找到N篇博客介绍，但是你会发现你看完大段代码之后还是没搞清楚，为了便于大家理解，我精简了代码，只保留了必要的部分。

 

1、在html页面引入百度地图API（文档地址：http://developer.baidu.com/map/wiki/index.php?title=j]]></description><category></category></item><item><title><![CDATA[关于Vue.js 使用v-cloak后仍显示变量的解决方法]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78815886</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78815886</guid><author>leadn</author><pubDate>Fri, 15 Dec 2017 18:45:47 +0800</pubDate><description><![CDATA[v-cloak 用法：

HTML代码：

div v-cloak>
  {{ message }}
div>


CSS代码：

[v-cloak] {
  display: none;
}


这样直至div内变量编译完毕后才会显示。

但有时添加完毕后仍有部分变量会显示，这是怎么回事呢？通过控制台查看，原来是 v-cloak 的display属性被优先级别高的样式]]></description><category></category></item><item><title><![CDATA[获取href所带参数]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78801642</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78801642</guid><author>leadn</author><pubDate>Thu, 14 Dec 2017 13:38:10 +0800</pubDate><description><![CDATA[function getQueryStringArgs() {
				var qs = (location.search.length > 0 ? location.search.substring(1) : ""),
					args = {},
					items = qs.length ? qs.split("&") : [],
				    item = null,
					na]]></description><category></category></item><item><title><![CDATA[纯 CSS 实现高度与宽度成比例的效果]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78799107</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78799107</guid><author>leadn</author><pubDate>Thu, 14 Dec 2017 09:53:52 +0800</pubDate><description><![CDATA[公司客户要求图片轮播比例1:1，以前都是写死然后让后台规定比例，以为要用js才能实现，百度一下，居然用css就能实现
html部分
   mint-swipe-items-wrap-->
		
			   mint-swipe-item img-->
		
		
			
		
		
		
		
	
css部分
.mint-swipe-items-wrap{
	width: 100%;]]></description><category></category></item><item><title><![CDATA[vue结合vue-cli项目搭建]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78710360</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78710360</guid><author>leadn</author><pubDate>Mon, 04 Dec 2017 15:42:17 +0800</pubDate><description><![CDATA[第一步参考                         https://www.cnblogs.com/wisewrong/p/6255817.html  http://www.jianshu.com/p/2769efeaa10a
1.scss                                 https://www.cnblogs.com/rainheader/p/65053]]></description><category></category></item><item><title><![CDATA[css水平垂直居中三种实现方法]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78632382</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78632382</guid><author>leadn</author><pubDate>Sat, 25 Nov 2017 15:58:27 +0800</pubDate><description><![CDATA[方法一：使用dispaly：inline-block 和 vertical-align 还有伪类实现
.block1{text-align:center;border:1px solid red;height:600px; }
.block1:before{content:'';display:inline-block;height:100%;vertical-align:middle;marg]]></description><category></category></item><item><title><![CDATA[display:table-cell]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78631960</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78631960</guid><author>leadn</author><pubDate>Sat, 25 Nov 2017 15:11:19 +0800</pubDate><description><![CDATA[display:table-cell指让标签元素以表格单元格的形式呈现，使元素类似于td标签。IE8+及现代版本的浏览器都支持此属性，IE6/7不支持（可用其他方法实现类似效果）。同样，display：table-cell属性也会被float，position：absolute等属性破坏效果，应避免同时使用。
设置了display：table-cell的元素：

对宽度高度敏感
对margin值无]]></description><category></category></item><item><title><![CDATA[大小不固定的图片和多行文字的垂直水平居中]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78625383</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78625383</guid><author>leadn</author><pubDate>Fri, 24 Nov 2017 15:48:11 +0800</pubDate><description><![CDATA[http://www.zhangxinxu.com/study/200908/img-text-vertical-align.html]]></description><category></category></item><item><title><![CDATA[inline-block元素间的换行符空格间隙问题]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78624624</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78624624</guid><author>leadn</author><pubDate>Fri, 24 Nov 2017 14:49:58 +0800</pubDate><description><![CDATA[block水平的元素inline-block化后，IE6/7没有换行符间隙问题，其他浏览器均有；»
 inline水平的元素inline-block后，所有主流浏览器都有换行符/空格间隙问题；
»
 font-size:0，去除换行符间隙，在IE6/7下残留1像素间隙，Chrome浏览器无效，其他浏览器都完美去除；
»
 letter-spacing负值可以去除所有浏览器的换行符间隙，但]]></description><category></category></item><item><title><![CDATA[清除浮动]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78624083</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78624083</guid><author>leadn</author><pubDate>Fri, 24 Nov 2017 14:10:06 +0800</pubDate><description><![CDATA[解决高度塌陷的问题 – 清除浮动 
CSS中有个讨论较多的话题就是如何清除浮动，清除浮动其实就一个目的，就是解决高度塌陷的问题。为什么会高度塌陷？什么时候会高度塌陷？塌陷原因是：元素含有浮动属性 – 破坏inline box – 破坏line box高度 – 没有高度 – 塌陷。什么时候会塌陷：当标签里面的元素只要样子没有实际高度时会塌陷。所以呢，并不是只要有浮动元素就会坍塌，就要清除的，CSS水平]]></description><category></category></item><item><title><![CDATA[electivizr-让IE6~8支持CSS3伪类和属性选择器]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78622741</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78622741</guid><author>leadn</author><pubDate>Fri, 24 Nov 2017 11:20:05 +0800</pubDate><description><![CDATA[electivizr-让IE6~8支持CSS3伪类和属性选择器]]></description><category></category></item><item><title><![CDATA[单行和多行文本文字省略]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78621532</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78621532</guid><author>leadn</author><pubDate>Fri, 24 Nov 2017 10:13:56 +0800</pubDate><description><![CDATA[补充：多行文本（对于现代浏览器，例如webkit内核的浏览器，或者移动端，是可以实现多行文本内容超出点点点…最后一行显示的，典型的CSS组合如下）

 display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;


jq插件：针对于5,6方]]></description><category></category></item><item><title><![CDATA[常见浏览器兼容性问题与解决方案]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78612418</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78612418</guid><author>leadn</author><pubDate>Thu, 23 Nov 2017 11:14:50 +0800</pubDate><description><![CDATA[所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。



在学习浏览器兼容性之前，我想把前端开发人员划分为两类：

第一类是精确按照设计图开发的前端开发人员，可以]]></description><category></category></item><item><title><![CDATA[Hbuilder中配置autoprefixer]]></title><link>https://blog.youkuaiyun.com/leadn/article/details/78563206</link><guid>https://blog.youkuaiyun.com/leadn/article/details/78563206</guid><author>leadn</author><pubDate>Fri, 17 Nov 2017 16:55:56 +0800</pubDate><description><![CDATA[Autoprefixer是一个后处理程序，不象Sass以及Stylus之类的预处理器。它适用于普通的CSS，可以实现css3代码自动补全。也可以轻松跟Sass，LESS及Stylus集成，在CSS编译前或编译后运行。详情见，https://github.com/postcss/autoprefixer

关于Autoprefixer

当Autoprefixer添加前缀到你的CSS，还不会]]></description><category></category></item></channel></rss>