为什么原版 HTML/JS（和 React）使用 camelCase 进行样式设置，而 CSS 不使用？ [关闭]答案

【问题标题】：Why does vanilla HTML/JS (and React) use camelCase for stylings, while CSS does not? [closed]为什么原版 HTML/JS（和 React）使用 camelCase 进行样式设置，而 CSS 不使用？ [关闭]
【发布时间】：2019-03-30 16:11:46
【问题描述】：

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

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

在 React 中内联设置样式 -

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

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

【问题讨论】：

我们在js写css js常用驼峰式
风格指南，伙计。
因为padding-top 不是有效的属性名称，除非您使用方括号表示法。
其实只有JS使用驼峰式，HTML使用连字符模式。
在 JS 中，- 是算术运算符，element.style.padding-top 会被解析为(element.style.padding) - top。因此，camelCase 解决方法。

标签： javascript html css conventions

【解决方案1】：

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

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

【讨论】：