赵十八

上一篇文章中我们学会了如何使用渐变实现条纹状的背景，但是实际上条纹背景并不是我们能实现的唯一的背景图案，利用渐变我们可以实现很多更为复杂的图案，本篇会介绍一些其他的简单而实用的背景图案。 网格的原理其实很简单，目前我们已经实现了条纹背景，那么如果我们将条纹背景组合呢？互相穿插组…

上篇文章讲述了实现条纹效果所使用的CSS特性并实现了水平和垂直条纹，接下来我们来实现斜向条纹。 现在我们来试一下斜向条纹的效果。 1. 斜向 First Try 看来效果并不是我们想象的那样。 2. 斜向 Second Try 双条纹 第一次尝试失败了，但是失败的经验还是有的，…

red，yellow，blue代表渐变色，表示从red - yellow - blue (相当于red 0% - yellow 50% - blue 100%)。 意思是从0%距离处为red，通过0%-50%的距离渐变到yellow，再通过50%-100%的距离渐变到blue。…

两个div实现内圆角很容易，只需要内圆角外直角即可。 这种方案更加灵活，我们可以在box上设置更多的样式，但是需要两个元素才能实现。 还记得上篇中，outline和box-shadow对于圆角的区别显示吗？box-shadow会贴合border的圆角，outline不会。当我们…

1. background-position扩展语法 background-position扩展语法： css3 中background-position 语法可以通过在偏移量前指定关键字，来设置四条边的偏移量。 2. background-origin background-…

以上是box-shadow的基本参数。box-shadow是为元素添加阴影效果的样式。但是我们可以通过对其属性的设置，呈现边框效果。 将x偏移量 ，y偏移量设置为0px，此时阴影会在元素下面不会超出元素本身。 模糊度设为0px，使阴影呈现实体效果。 增大扩散半径，可以理解为阴影…

这段css样式，我们期待的效果是有一个半透明的边框。而实际效果是怎么样的呢？ 没错，边框不见了。这跟我们所期待的效果并不符合。原因在于，默认情况下，背景颜色会延伸到边框上，这点我们可以通过虚线边框来发现实际发生了什么。 所以，实际上我们的透明边框其实是存在的，只不过由于背景颜色…

本文想要介绍一些linear-gradient的更多实用性比较强的用法，前面有根据CSS揭秘总结的讲线性渐变实现条纹背景的方法。 red，yellow，blue代表渐变色，表示从red - yellow - blue (相当于red 0% - yellow 50% - blue…

此题是一个最短编辑距离问题，我们在工作中用到工具和框架有很多也是类似的算法。比如Git提交，对比差异。vue中将更新前的虚拟dom改成更新后的虚拟dom（vue中对此做了取舍，有优化） 三种操作，增，删，改，都是针对word1的。但是其实此题目中只要求求出最短操作。所以 wor…