微信小程序 tdesign ui 库中的 css 选择器疑问
问题描述:
在小程序中使用 TDesign UI 库时,开发者遇到一个令人困惑的 CSS 选择器:
如图,DOM结构中,元素class 是 't-grid t-card class t-class'
,但是选择器是 '.t-grid--card'
这怎么生效的?这个写法也让我疑惑,像BEM命名又像是CSS变量,但好像都不是。
希望有大佬解惑。
问题解答:
立即学习“前端免费学习笔记(深入)”;
‘.t-grid–card’ 选择器的生效原理如下:
t-class 类名:这是小程序开发中的一种外部样式类,表示该元素将使用该样式类定义的样式。
BEM 命名风格:.t-grid–card 采用了 BEM 命名风格,其中:
t-grid: 表示元素的块(block)名称–card: 表示元素的元素(element)名称
在实际项目中使用 BEM 命名时,不一定需要严格按照 DOM 结构增加后缀。为了缩减 class 名称长度,可以根据团队的命名规范进行合理调整。
CSS 变量:–card 部分不是 CSS 变量,CSS 变量是以 — 开头声明并且通过 var() 使用。
以上就是微信小程序 TDesign UI 库中 CSS 选择器:’.t-grid–card’ 如何生效?的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2803677.html