为什么原版 HTML/JS（和 React）使用驼峰命名法来设置样式，而 CSS 不使用？

Question

关于样式的不同技术需要不同的约定来命名某些属性，主要是驼峰式与连字符式

通过 JS 直接在 HTML DOM 节点上设置样式 - element.style.paddingTop = "12px";

在 React 中设置内联样式 - < Component style={{paddingTop: "12px"}} />

在 .CSS 文件中设置它 - .selector {padding-top: 12px}

不同规则的根本原因是什么？我不明白为什么这比使用驼峰命名的所有 HTML/CSS/JS 或全部使用连字符样式更好。

Answer 1

在 JavaScript 中，由于语法规则，kebab-case不适合。-不允许在标识符中使用，因此padding-top对变量或属性名称无效。

在 CSS 中，camelCase不是一个好习惯，因为 CSS 不区分大小写。className并且classname是 CSS 的相同标识符。