- 博客(12)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 选择器-《css权威指南（第4版）》核心知识整理
选择器分为class选择器和ID选择器，属性选择器，派生选择器、伪类和伪元素。其中class和ID选择器，大都非常清楚，这里就不在展开。本节重点梳理一下属性选择器、伪类和伪元素，相信通过本文的重新整理能够对选择器的相关观念能够有一个全面而系统的认识，以便在将来的实践中带来便利。 1，属性选择器1.1 简单属性选择器：选择具有特定属性的元素而不管其属性值。h1[class] {...
2018-10-07 22:28:29
2833
原创 css的左图右文布局且保持图片宽高比例固定放缩
有一个常见需求：就是一个展示页上，左边显示一张图片，右侧加一些配套文字。效果如下：当页面宽度增加时，图片响应变大，缩小时相应的变小。但图片的宽高比例不能改变。这种布局，一般肯定可以用flex方法轻松实现，但考虑到兼容性的问题。不得不采用一些“老式”但兼容良好的做法：float方法。这种就是一个父div包含2个子div，再对两个div左浮动。代码：<div class...
2018-08-26 17:46:28
3382
原创 vue父子组件的传值与更新问题
之前在项目中有一个需求：在父组件那一层数据变动时，希望子组件的数据刷新（甚至让子组件的一些方法也能执行）。如上图，点击button实现子组件的刷新。那么，该怎么做呢，1，props属性：首先我们知道使用props属性，但只能使子组件有关props部分的属性刷新，别的部分还是不动的，可以解决很有限的刷新。对子组件的生命周期上的方法是完全操作不了的。2，重新加载用 v-if...
2018-08-23 19:57:35
7358
1
原创 前端的正则使用（原理篇）
本篇接上篇的基础篇，是对基础篇从原理上加以理解。1，捕获原理1.1，捕获组编号规则捕获组就是把正则表达式中的子表达式匹配的内容，保存到内存中以数字编号的组里，方便后面引用。编号规则指的是以数字为捕获组进行编号的规则。规则中编号为0的捕获组，指的是正则表达式整体。捕获组通过从左到右计算其左开括号来编号 举例：正则表达式可以用来匹配格式为yyyy-MM-dd的日期，为了...
2018-08-20 18:39:39
679
原创 前端的正则使用（基础篇）
正则的总结，进行过多次，但一般都是记不了几天就会忘得无法有效使用。究其原因就一个：没有明白其中的原理，死记硬背。而我是一个不爱死记硬背的人。所以这次又一次总结，从原理上加以整理。1，基本概念正则表达式的三个基本元素：元字符，量词，修饰符。元字符：/abc/ 比如左边的正则匹配字符串中的abc。正则中的abc就是元字符。元字符是正则匹配的基本元素。量词：是元字符中的重复性概念。...
2018-08-17 10:36:14
1133
原创 相对单位em 和 rem --读《CSS in depth》
目录 1，绝对单位和相对单位2，em的使用分三种情况： 1，把各个方向的padding的值设置为字号大小 2，对font-size 使用em 3，对font-size和padding等同时使用相对单位3，rem 3.1，相对单位和响应式（一个例子）1，绝对单位和相对单位对于现在的互联网，页面有可能会在各种型号的屏幕上展示。既可能是一个5英寸的手机屏，...
2018-08-13 20:33:47
583
原创 webpack 4 使用示例（二）
开发模式在前面一篇文章（webpack 4 使用示例（一）），我们已经针对webpack的核心概念配合各种例子，做了清楚的展示。在这篇，我们更进一步介绍webpack的更多特性。 按照前面的方法，当用webpack打包我们的源代码时，很难追踪/定位错误或警告出现的位置。比如，当我们打包a.js b.js c.js 为bundle.js时包含了一个错误。那么当我们在浏览器调试时，只能追...
2018-08-03 14:17:40
273
原创 webpack 4 使用示例（一）
我将在这篇文章着重介绍最基本的配置示例。介绍完之后会以项目的形式展示其他使用的源码。1，基本示例： 新建一个项目mkdir webpack-demo && cd webpack-demonpm init -ynpm install webpack webpack-cli --save-dev给项目中添加index.html和 src/index.js文件。此时...
2018-08-01 16:47:34
475
原创 webpack4的基本使用
webpack 是一个现代JS应用的静态模块打包器（static module bundler）。当运行webpack时，它就将项目中的各种模块（比如js,css, png, cjs，sass等各种模块）会打包成静态资源。如下图webpack功能非常强大，但学习起来也很简单。只需要理解4个核心概念就好：Entry, Output, Loaders, Plugins本篇将简要介绍这4个概...
2018-08-01 11:56:25
288
原创 前端模块化的简单综述（二）
6.0，npm 6.0.1 NPM产生的背景当一个网站依赖的库越来越多，前端开发就很麻烦：去 jQuery 官网下载 jQuery 去 BootStrap 官网下载 BootStrap 去 Underscore 官网下载 Underscore ……对网站依赖的代码，到处找网站下载很不方便，而用一个工具把这些代码集中到一起来管理就很有必要。这个工作的完成者是 Isaac Z. ...
2018-07-24 18:15:04
195
原创 前端模块化的简单综述（一）
刚学前端的时候，曾有一段时间很迷糊，不知道为啥突然从html文件、js文件和css文件三件套，变成需要打包在服务器才能用了。这种不明白感，随着使用vue，weex等框架逐步熟练之后，降低不少。但依然不知道，这一路究竟发生了什么。 故在此，梳理整个前端模块的发展过程，为自己的疑惑提供一个完满的解答。（有不少内容来自对网络上一些大神的博客整理，本文会在文章最后做出引用和感谢）目录 ...
2018-07-20 13:40:45
1275
原创 js模块的基本用法
js模块，在es6之前，实现都是通过立即执行函数实现。这里复盘这种古老的模块实现方式，其目的是：1，了解js模块的最基本原理/基石.2，为后来的模块化学习打下基础。 1,基本模块的书写方法：IIFE var MODULE = (function () { var my = {}, privateVariable = 1; function privateM...
2018-07-20 12:10:35
506
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人