自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(52)
  • 收藏
  • 关注

翻译 webpack的5个基本概念

 1.webpack是什么webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。2.基本概念1).入口起点(entry point)   指示...

2018-12-26 10:52:38 1147

原创 npm 用法

1.为什么使用npm       方便快捷使用包2.怎么安装     下载nodejs   下载地址3.常见命令行  npm  -v                                  查看版本         install                            下载安装                                              -g...

2018-07-08 15:06:17 336

原创 yarn基础用法

1.为什么用yarn快捷(可以离线安装本地modules)、安全(在安装前会检查包是否出错)、可靠(不受电脑环境影响)2.如何安装   window可以使用官方地址msi下载安装,也可以通过 npm install yarn -g    yarn --version    查看是否安装成功3.常用命令yarn-h                  命令提示yarn-init            ...

2018-07-08 14:42:01 2187

原创 时间戳转成特定格式

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

2017-12-27 16:07:36 506

转载 classList介绍和原生JavaScript实现addClass、removeClass等

使用jQuery可以给元素很方便的添加class和删除class等操作,现在原生的JavaScript也可以实现这个方法了。使用classList可以方便的添加class、删除class、查询class等。语法:let elementClass = element.classList;elementClasses 是一个 DOMTokenList 表示 element

2017-12-27 16:05:39 7210

转载 CSS 外边距(margin)重叠及防止方法

CSS 外边距(margin)重叠及防止方法边界重叠是指两个或多个盒子(可能相邻也可能嵌套)的相邻边界(其间没有任何非空内容、补白、边框)重合在一起而形成一个单一边界。两个或多个块级盒子的垂直相邻边界会重合。结果的边界宽度是相邻边界宽度中最大的值。如果出现负边界,则在最大的正边界中减去绝对值最大的负边界。如果没有正边界,则从零中减去绝对值最大的负边界。注意:相邻的盒子可

2017-12-27 13:25:03 415

转载 手机端H5获取当前城市的方法

移动端的H5页面提供了定位的功能,那么如何实现一个最简单的需求-----获取用户当前城市?你可能搜一下就会找到N篇博客介绍,但是你会发现你看完大段代码之后还是没搞清楚,为了便于大家理解,我精简了代码,只保留了必要的部分。 1、在html页面引入百度地图API(文档地址:http://developer.baidu.com/map/wiki/index.php?title=j

2017-12-15 18:47:18 7007 1

转载 关于Vue.js 使用v-cloak后仍显示变量的解决方法

v-cloak 用法:HTML代码:div v-cloak> {{ message }}div>CSS代码:[v-cloak] { display: none;}这样直至div内变量编译完毕后才会显示。但有时添加完毕后仍有部分变量会显示,这是怎么回事呢?通过控制台查看,原来是 v-cloak 的display属性被优先级别高的样式

2017-12-15 18:45:47 1327

原创 获取href所带参数

function getQueryStringArgs() { var qs = (location.search.length > 0 ? location.search.substring(1) : ""), args = {}, items = qs.length ? qs.split("&") : [], item = null, na

2017-12-14 13:38:10 3358

原创 纯 CSS 实现高度与宽度成比例的效果

公司客户要求图片轮播比例1:1,以前都是写死然后让后台规定比例,以为要用js才能实现,百度一下,居然用css就能实现html部分 mint-swipe-items-wrap--> mint-swipe-item img--> css部分.mint-swipe-items-wrap{ width: 100%;

2017-12-14 09:53:52 2748

原创 vue结合vue-cli项目搭建

第一步参考                         https://www.cnblogs.com/wisewrong/p/6255817.html  http://www.jianshu.com/p/2769efeaa10a1.scss                                 https://www.cnblogs.com/rainheader/p/65053

2017-12-04 15:42:17 255

转载 css水平垂直居中三种实现方法

方法一:使用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

2017-11-25 15:58:27 996

转载 display:table-cell

display:table-cell指让标签元素以表格单元格的形式呈现,使元素类似于td标签。IE8+及现代版本的浏览器都支持此属性,IE6/7不支持(可用其他方法实现类似效果)。同样,display:table-cell属性也会被float,position:absolute等属性破坏效果,应避免同时使用。设置了display:table-cell的元素:对宽度高度敏感对margin值无

2017-11-25 15:11:19 530

转载 大小不固定的图片和多行文字的垂直水平居中

http://www.zhangxinxu.com/study/200908/img-text-vertical-align.html

2017-11-24 15:48:11 330

转载 inline-block元素间的换行符空格间隙问题

block水平的元素inline-block化后,IE6/7没有换行符间隙问题,其他浏览器均有;» inline水平的元素inline-block后,所有主流浏览器都有换行符/空格间隙问题;» font-size:0,去除换行符间隙,在IE6/7下残留1像素间隙,Chrome浏览器无效,其他浏览器都完美去除;» letter-spacing负值可以去除所有浏览器的换行符间隙,但

2017-11-24 14:49:58 1012

转载 清除浮动

解决高度塌陷的问题 – 清除浮动 CSS中有个讨论较多的话题就是如何清除浮动,清除浮动其实就一个目的,就是解决高度塌陷的问题。为什么会高度塌陷?什么时候会高度塌陷?塌陷原因是:元素含有浮动属性 – 破坏inline box – 破坏line box高度 – 没有高度 – 塌陷。什么时候会塌陷:当标签里面的元素只要样子没有实际高度时会塌陷。所以呢,并不是只要有浮动元素就会坍塌,就要清除的,CSS水平

2017-11-24 14:10:06 243

转载 electivizr-让IE6~8支持CSS3伪类和属性选择器

electivizr-让IE6~8支持CSS3伪类和属性选择器

2017-11-24 11:20:05 259

转载 单行和多行文本文字省略

补充:多行文本(对于现代浏览器,例如webkit内核的浏览器,或者移动端,是可以实现多行文本内容超出点点点…最后一行显示的,典型的CSS组合如下) display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;jq插件:针对于5,6方

2017-11-24 10:13:56 815

转载 常见浏览器兼容性问题与解决方案

所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况。在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。在学习浏览器兼容性之前,我想把前端开发人员划分为两类:第一类是精确按照设计图开发的前端开发人员,可以

2017-11-23 11:14:50 537

转载 Hbuilder中配置autoprefixer

Autoprefixer是一个后处理程序,不象Sass以及Stylus之类的预处理器。它适用于普通的CSS,可以实现css3代码自动补全。也可以轻松跟Sass,LESS及Stylus集成,在CSS编译前或编译后运行。详情见,https://github.com/postcss/autoprefixer关于Autoprefixer当Autoprefixer添加前缀到你的CSS,还不会

2017-11-17 16:55:56 1723 2

转载 scss常见用法

简介Sass 有两种语法规则(syntaxes),目前新的语法规则(从 Sass 3开始)被称为 “SCSS”( 时髦的css(Sassy CSS)),它是css3语法的的拓展级,就是说每一个语法正确的CSS3文件也是合法的SCSS文件,SCSS文件使用.scss作为拓展名。第二种语法别成为缩进语法(或者 Sass),它受到了Haml的简洁精炼的启发,它是为了人们可以用和css相近的但是更

2017-11-17 16:30:01 33563 1

转载 1px边框问题和retina屏下的background-image

1px边框在lib-flexible下如何处理web app有时候会设计出一些特别细的线条或者边框,如果我们直接通过css设置边框为1px:- Hide codeborder: 1px solid #ccc;结果会发现这种边框在手机里看起来的效果,显得特别地粗,之所以会有这个效果,原因很简单,因为现在大部分手机的分辨率很高,一个css像素,比如上面代码中

2017-11-17 14:32:27 2303

转载 基于CSS color属性的静态UI组件重构策略

基于CSS color属性的静态UI组件重构策略by zhangxinxu from http://www.zhangxinxu.com/wordpress/?p=5775一、传统静态UI组件实现的隐隐痛点我们都知道,一个网站,只要设计师稍微有点专业,其站点的一些基础颜色都是贯穿始终的。主色,链接色,警示颜色,以及各种状态颜色等等,都是一脉相承的,如果贵站的文字的红

2017-11-14 16:31:34 878

转载 鑫大神之前端见解

鑫大神对前端的见解正好解决了正在迷茫的我,到底是应该迎合市场去学习vue,angular,react,还是再打好基础,把最基础的html,css,js再好好捋几遍呢?答很明显鑫大神给出了答案,不积跬步,无以至千里。打好基础把!博客:http://www.zhangxinxu.com/wordpress/2017/06/ten-question-about-frontend-zhihu

2017-11-14 14:47:52 241

转载 HBuilder使用夜神模拟器调试Android应用

由于HBuilder的扫描机制无法直接连上夜神模拟器。我搞了好久终于找到办法了,分享给大家。首先,启动HBuilder和夜神模拟器然后打开cmd命令提示符cd进入夜神模拟器bin目录执行以下命令nox_adb connect 127.0.0.1:62001nod_adb devices如下图: 然后cd进入HBuild

2017-03-29 13:19:24 279

转载 webpack react基础配置二 热加载

用到 webpack-dev-server  先安装,注意 装到全局 还是本项目我也没注意  因为之前一直报错,有很小可能是安装到本地解决了,或者是我网络问题:装到全局:$ npm install webpack-dev-server -g装到本地: $ npm install webpack-dev-server --save-dev修改配置文件   图片有说明:

2017-03-18 13:00:40 856

转载 前端踩的一些坑

今天用bootstrap modal 进行ajax发送数据时,发送数据时第一次点击,发送一次ajax提交,第二次点击发送两次ajax提交,第三次点击发送3次ajax提交...),原来是在标签上绑定了太多事件,用jq方法 .off()即可去除。参考博文:本节内容事件代理清除标签的所有事件bootstrap的模态框自定义方法ajax在django里面实现post

2017-02-15 16:36:28 2632 1

转载 深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制

我记得在刚开始接触动态HTML及JavaScript时就接触过关于鼠标右键屏蔽的脚本代码,当时这些代码很多会用在防止浏览者未经允许的复制网页上的文字或者其他内容,后来的实际应用证明这种做法是不符合用户体验的,而且破解的方法也有很多,比如我曾经写过一篇文章讲解如何解除网页禁止复制的办法。由此可见,限制右键及复制是不明智的做法,但是今天我仍然要谈谈关于禁止网页复制、右键菜单的事儿,因为随着网页

2017-02-11 11:56:10 3043

原创 git使用教程

1.git创建仓库 git  init                      该命令执行完后会在当前目录生成一个 .git 目录。git init newrepo   初始化后,会在 newrepo 目录下会出现一个名为 .git 的目录,所有 Git 需要的数据和资源都存放在这个目录中。2.添加文件git add .             (.匹配所有带.的文件)g

2016-11-20 16:33:05 329

转载 subtlime text3 使用教程

1.如何下载sublime text3 网址:http://www.sublimetext.com/32.下载package controlhttps://packagecontrol.io/installation#st33.常用插件1.ement     2.html-css-js prettity       3liveRoad    4.alignment  

2016-08-21 22:45:47 876

转载 Github使用教程

1 如何在 GitHub 上创建一个新仓库,并进行简单的翻译协作http://www.jianshu.com/p/db41289d0c972 专为设计师而写的GitHub快速入门教程http://blog.jobbole.com/73944/3 如何在GitHub上FORK一个项目来贡献代码以及同步原作者的修改http://www

2016-07-21 23:05:39 306

转载 搭建Web服务器Tomcat

(一)搭建Web服务器Tomcat1.配置环境变量首先安装jdk,我使用的是jdk-6u22。然后配置环境变量:在CLASSPATH环境变量后加上(即加上jdk安装路径下的tools.jar和dt.jar文件):[cpp] view plain copy.;%JAVA_HOME%\lib\tools.jar;%

2016-07-21 12:48:13 606

转载 windows 7系统安装与配置Tomcat服务器环境

点击链接

2016-07-21 12:44:30 219

转载 Sublime Text3 无法使用LiveReload插件的解决方法

问题更新最近电脑系统换为ubuntu后,发现原来这个问题的解决办法和windows中略有不同,及时记录下来前言以前一直在用sublime text2, 有一款插件感觉非常好用,就是LiveReload, 在sublime中写完代码,按下ctrl+s保存后,浏览器自动刷新页面,可直接查看效果, 而不用切换到浏览器中再按F5刷新。这对于做web开发的真心方便,最爽的莫过

2016-07-18 20:31:27 916

转载 过滤选择器:基本过滤选择器 && 内容过滤选择器 && 可见性过滤选择器

过滤选择器:过滤选择器主要是通过特定的过滤规则来筛选出所需的 DOM 元素, 该选择器都以 “:” 开头按照不同的过滤规则, 过滤选择器可以分为基本过滤, 内容过滤, 可见性过滤, 属性过滤, 子元素过滤和表单对象属性过滤选择器.一、基本过滤选择器改变第一个 div 元素的背景色为 # bbffaa改变最后一个 div 元素的背景色为 # bbffa

2016-07-18 16:17:53 351

转载 前端必学核心技术知识

各核心技术知识图谱大曝光,知识库精华资源强力推荐HTML5知识库HTML5知识图谱知识图谱由前端技术专家、CSDN博客专家侯志强(@yisuowushinian)绘制,全栈工程师、架构师、Android和HTML5专家张西涛(@offbye)、HTML5研发工程师谷震平(@guzhenping)等多位HTML5领域专家、开发高手担任特邀编辑参与内容审核,已收录各核心

2016-07-18 15:54:19 10232

转载 【BOM操作】JavaScript中的event对象之总结

Event属性和方法: 1. type:事件的类型,如onlick中的click; 2. srcElement/target:事件源,就是发生事件的元素; 3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下;(firefox中 0代表左键,1代表中间键,2代表右键) 4. c

2016-07-18 15:49:53 313

转载 JavaScript 闭包及其机制

首先要区分两个概念,一是匿名函数,一是闭包。所谓匿名函数,就是创建函数没有给定函数名。经常出现的包括函数表达式,就是定义一个匿名函数,然后将函数赋值给某个变量,而此时这个变量就相当于该函数的函数名,例如:var sayHi = function(){ alert("Hi");}; //注意这个分号sayHi(); //调用函数还有一种常用匿名函数的情况是回调函数,

2016-07-18 15:41:56 204

转载 解析Javascript事件冒泡机制

1. 事件         在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作。         浏览器的事件表示的是某些事情发生的信号。事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3school教程 进行了解,这将有助于更好地理解以下的内容 。2.冒泡机制            什么是冒泡呢?      

2016-07-18 15:15:34 355

转载 【JavaScript】利用滚动事件window.onscroll与position:fixed写兼容IE6的回到顶部组件

现在网上的回到顶部组件,懂不懂就一大段让人看不懂javascript代码,还各种不兼容。起始这个组件,完全可以自己利用javascript的滚动事件window.onscroll与position:fixed手写。IE6的兼容性问题主要出现在position:fixed上面,如何解决已经在《【CSS】IE6中的position:fixed问题与随滚动条滚动的效果》(点击打开链接)介绍过了。

2016-07-18 15:05:41 756

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除