CSS 的命名，采用 BEM 命名规范，可以有效的避免组件间样式的相互污染，减少嵌套层级。具体规则如下：

BEM 是什么?

BEM 使用分隔符将类名区隔成三个部分：

[prefix]-[block]__[element]--[modifier]

• prefix：全局的前缀，这里指代表 tdesign 的前缀，也就是 t-
• Block(块) ：组件的最外层父元素，这个类包含最通用和可重用的功能。
• Element(元素) ：组件内可包含一个或多个元素，元素为块添加了新功能。无需重置任何属性。
• Modifier(修饰类) ：块或元素都可以通过修饰词来表示为变体。

[[toc]] 浏览器的兼容性 网络上已经有成熟的css代码库为我们解决浏览器不一致问题，例如normalize.css、minireset和ress，你可以在你的项目中引用它们。; 如果你不想使用第三方代码库，你可以使用下面的样式来进行一个非常基本的css reset：; 上面的代码看起来有些霸道，将所有元素的内外边距都设置为0了，而正是没有了这些默...

[[toc]] 1. 实现水平居中和垂直居中 源码地址：https://codepen.io/una/pen/YzyYbBx (https://codepen.io/una/pen/YzyYbBx) [vanilla] 2. 可解构的自适应布局 源码地址：https://codepen.io/una/pen/WNQdBza (https://codep...

[[toc]] 1. 发送效果 [vanilla] 2. 霓虹效果 [vanilla] 3. 边框效果 [vanilla] 4. 圆形效果 [vanilla] 5. 圆角效果 [vanilla] 6. 冰冻效果 [vanilla] 7. 闪亮效果 [vanilla] 8. 加载效果 [vanilla] 9. animation动画 ::: normal...

Css中BEM书写规范

BEM是Block（块）、Element（元素）、Modifier（修饰符）的简写，是一种组件化的 CSS 命名方法和规范

BEM是基于组件的web开发方法。其思想是将用户界面分隔为独立的块，从而使开发复杂的UI界面变得更简单和快，且不需要粘贴复制便可复用现有代码。

BEM由Block、Element、Modifier组成。选择器里用以下连接符扩展他们的关系：

引用：http://getbem.com/naming/

[[toc]] 时钟 ::: normal-demo [vanilla] :::