1. 文字超出部分显示省略号 2. 文字垂直居中 3. 首行缩进 4. 首字下沉 5. 中英文自动换行 6. 文字阴影 text-shadow 为网页字体添加阴影，通过对text-shadow属性设置相关的属性值。 X-offset:指阴影居于字体水平偏移的位置。 Y-offs…

前言 布局的传统解决方案，基于盒状模型，依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。 2009年，W3C 提出了

前言前篇传送门：猛戳这里其实大多数的技巧前篇都已经讲完了，本文算是具有补充性质的番外篇吧0.03D方块如何在CSS中创建立体的方块呢？用以下的SCSSmixin即可方块的长度、高度、深度都可以通过CS

有这样一个问题。 别急，下面我们就开始逐一分析各种方法在web自适应布局下的使用姿势，最后做个总结。 本文的所有例子使用了同一种三栏布局。源代码点我 1. 浮动布局 float:left|right 最常用的布局方式之一，设置了float的元素脱离了文档流。需要注意在使用过浮动…

一声梧叶一声秋，一点芭蕉一点愁，三更归梦三更后。 大概是因为入秋的缘故，最近的感慨比较多。 很多的碎碎念都用都用 HTML 跟 CSS 来记录在我的codepen https://codepen.io/krischan77 至上，眼见积累到了一些了，就选出几个来与大家一同分享。…

本文是笔者写CSS时常用的套路。不论效果再怎么华丽，万变不离其宗。 有时候，我们需要给多个元素添加同一个动画，播放后，不难发现它们会一起运动，一起结束，这样就会显得很平淡无奇。 那么如何将动画变得稍微有趣一点呢？很简单，既然它们都是同一时刻开始运动的，那么让它们不在同一时刻运动…

前几天看了一篇文章 ， 颠覆了我对 CSS 认识，心中无数次蹦出一个念头：'卧槽，卧槽，还能特么这么用，这特么太叼了' ... 本文中，所有的图形都是在单个标签内实现的，大量使用了 CSS3 中的 ::before 、::after 伪元素，transparent 、borde…

cover 网页内容完全覆盖可视窗口，即页面完全充满屏幕，右图。适配关键！ 适配的核心是：通过 constant() 可以获取到非安全边距，再结合 padding 或 margin 来控制页面元素避开非安全区域。 Webkit在iOS11中新增CSS Functions: en…

何为技巧，意指表现在文学、工艺、体育等方面的巧妙技能。代码作为一门现代高级工艺，推动着人类科学技术的发展，同时犹如文字一样承托着人类文化的进步。 每写好一篇文章，都会使用大量的写作技巧。烘托、渲染、悬念、铺垫、照应、伏笔、联想、想象、抑扬结合、点面结合、动静结合、叙议结合、情景…