05 2018 档案

【VUE】@click加上v-bind绑定切换类名及动画事件
摘要：好长的名字。。。 效果是 点击元素，通过改变类名的方式让其改变颜色+移动动画效果，这里用的是v-bind和@click 废话不说 show me the code！ :class是 v-bind:class的缩写，给class绑定上事件，然后通过三元表达式判断事件 idOk是一个标志位，类似于第二篇 阅读全文
posted @ 2018-05-17 10:52 krank 阅读(5920) 评论(0) 推荐(0)
【webpack系列】1 What is webpack?
摘要：什么是webpack？ 现今的网页可以看做是功能丰富的应用，拥有着复杂的js代码和一大堆依赖包。为了简化开发的复杂程度，有了很多好用的实践方法 模块化 让我们可以把复杂的程序细化为小的文件 类似于TypeScript这种在js基础上拓展的开发语言，使我们能够实现目前版本的Js不能直接使用的特性，并且 阅读全文
posted @ 2018-05-09 00:34 krank 阅读(255) 评论(0) 推荐(0)
【前端工程化系列】简谈前端模块化开发与开发规范
摘要：没有前戏，简明扼要的进入主题——什么是模块化开发？ 模块化开发，一个模块就是一个实现特定功能的文件，有了模块我们就可以更方便的使用别人的代码，要用什么功能就加载什么模块。 模块化开发的4点好处： 1 避免变量污染，命名冲突 2 提高代码复用率 3 提高维护性 4 依赖关系的管理 前端模块化规范从原始 阅读全文
posted @ 2018-05-09 00:24 krank 阅读(10081) 评论(0) 推荐(1)
【css】弹性盒模型
摘要：弹性盒模型flexBox 弹性盒模型是c3的一种新的布局模式 它是指一种当页面需要适应不同屏幕大小以及设备类型时，确保元素有恰当行为的布局方式。 引入弹性盒模型布局的目的是提供一种更有效的方法来对一个容器中的子元素进行排列、对齐和分配空白空间。 兼容性 IE11 弹性盒模型内容 弹性盒模型由弹性容器 阅读全文
posted @ 2018-05-08 20:22 krank 阅读(477) 评论(0) 推荐(0)
【CSS】清除浮动的五种方式
摘要：清除浮动是一件功德无量的事情23333 这里记录一下清除浮动的多种方式 *首先要明确的是，为什么要清除浮动？ A 影响其他元素定位 父盒子高度为0，子盒子全部浮动、定位，子盒子不会撑开父盒子，下面的元素会到子盒子的下面 B 背景图片或颜色不能正常显示 由于浮动产生，如果对父级设置了CSS背景颜色或C 阅读全文
posted @ 2018-05-08 12:15 krank 阅读(213) 评论(0) 推荐(0)
【HTML+CSS】右侧固定，左侧自适应布局
摘要： 阅读全文
posted @ 2018-05-08 11:33 krank 阅读(313) 评论(0) 推荐(0)
这可能是最简明扼要的 js事件冒泡机制+阻止默认事件 讲解了
摘要：哎 js事件冒泡机制和阻止冒泡 阻止默认行为好像永远也整不清楚，记了忘 忘了记。。。醉了 这篇文章写完以后下次再忘记 就呼自己一巴掌，忘一次一巴掌 首先要明白两个概念——事件和事件流 事件指的是用户或浏览器自身执行的某种动作，又称为原始事件模型，例如onclick等 事件流指的是 从页面中接收事件的 阅读全文
posted @ 2018-05-06 17:54 krank 阅读(237) 评论(0) 推荐(0)
【待填坑】同源策略
摘要：111 阅读全文
posted @ 2018-05-05 14:42 krank 阅读(105) 评论(0) 推荐(0)
link @import区别 src href的区别
摘要：先说页面引入css的四种方式吧 1 在头部写在style里面 2 行内样式 tyle= 3 外部引入 link和@import的区别 link属于XHTML的标签，而@import只是css提供的一种方式 link除了加载css还能做其他的事情，比如定义RSS 而@import只能加载css lin 阅读全文
posted @ 2018-05-05 14:31 krank 阅读(405) 评论(0) 推荐(0)
盒子模型漫谈
摘要：对盒子模型一直只是处于了解但是说不明白的过程，做题的时候卡壳在这感觉很不爽，写文章一次搞清楚盒子模型的种种！ 盒子模型： 一个标准的盒子模型包括content（width height） border padding margin这四种属性 它的作用是让我们充分理解div+css模型的定位功能，就是 阅读全文
posted @ 2018-05-05 13:32 krank 阅读(131) 评论(0) 推荐(0)
【css】 文本超出2行显示省略号
摘要：首先，要知道css的三条属性。 overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; //溢出不换行 这三个是css的基础属性，需要记得。 但是第三条属性，只能显示一行，不能用在这里，那么如 阅读全文
posted @ 2018-05-02 14:57 krank 阅读(941) 评论(0) 推荐(0)