1-1. 设置input 的placeholder的字体样式 1-2. 单行和多行文本超出省略号 1-3. 负边距使用技巧 1-4. 定位同时设置方位情况 1-5. 相邻兄弟选择器之常用场景 1-6. outline属性的妙用技巧 1-7. 隐藏滚动条或更改滚动条样式 1-8.…

前段时间笔者收到可爱漂亮的小册姐姐的邀请，做了人生首次直播分享。分享主题是《玩转CSS的艺术之美》，跟笔者在9月底发布的掘金小册同名。 9月底发布的玩转CSS的艺术之美，首日预售就达到709本，预售仅三日就破1000本。这也让笔者感到惊讶，没想到CSS技术还是那么受倔友们的欢迎…

接着前文看《CSS权威指南》，本文整理一些CSS动画的知识点，同时给出一些例子。 在CSS动画中我们经常需要通过变形来达到一些奇妙的效果。使用 transform 首先要明确变形是基于笛卡尔坐标系，也就是通常所说的 x/y/z See the Pen FlipCard on C…

对于冒泡排序，很多小伙伴已经可以说很熟悉了，顺手就可以写出来，但对于一个初学者来说，小鹿想通过这篇文章，让你一次性就理解冒泡排序以及冒泡排序的优化，就不用去翻看其他文章了。 记得之前一个读者和小鹿说去面试的时候，面试官让写一个冒泡排序，也写出来了，最后去没有通过面试。其实他的冒…

写本文的起因是，一天在群里有同学说误打误撞下，使用负的 outline-offset 实现了加号。嗯？好奇的我马上也动手尝试了下，到底是如何使用负的 outline-offset 实现加号呢？ 修改 outline-offset 到一个合适的负值 ，那么在恰当的时候，outli…

在 svg 中对图形（line、polyline、rect、circle、ellipse、polygon）、路径（path）、文本(text、textPath、tspan)的描边都需要用到stroke属性。 stroke：颜色。 stroke-width：宽度。 stroke-…

电商平台通常有一种类似放大镜的效果，用来查看商品的细节，我们现在就是要模仿这种效果。 原理：这种放大说白了就是一张大图和一张小图，滑块在小图上滑动，通过计算获取滑块相对于整张图的位置，而滑块与大图的显示区域是成比例的，根据比例关系将大图的位置也调整到响应的位置，这里对大图位置的…

译者注：本文中Element和Component在某些场合是通用的，本质上LitElement只是WebComponents的一种实现，所以元素也可以认为就是组件。 ShadowDOM API允许在自定义元素上创建封装好的DOM树，shadowDOM树的根节点是shadowRo…

《CSS系列漫画教程》共15讲，是我2012年刚毕业步入互联网时的早期作品。时隔多年，如今互联网内容为王的分享经济迅速发展，这些作品压箱底太可惜，不如分享给大家。 漫画还停留在当年前端兼容ie6的时代，如今ie6随着那一代人的青春一起逝去，大家各奔前程，留下是感情和回忆。漫画不…