glyphicon 在 JSX 中添加边距

Question

在 React 组件中使用的 glyphicon 添加边距的正确方法是什么？我试过简单的： <span className='glyphicon glyphicon-exclamation-sign' margin-left='10px'/> 但它没有增加所需的保证金。根据这个： https://zhenyong.github.io/react/tips/inline-styles.html 我认为应该工作的是 <span className='glyphicon glyphicon-exclamation-sign' style={margin-left: '10px'}/> 但它给了我错误： Module build failed: SyntaxError: Unexpected token, expected , 我还尝试添加样式组件（我们在 css 上使用它），例如

const glyp = styled.span.attrs({
  className: 'glyphicon glyphicon-exclamation-sign'
)}`
  margin-left: 10px
`

但它根本不呈现感叹号符号（但是需要 space）。

正确的做法是什么？

Answer 1

将“margin-left”替换为“marginLeft”。

来自 React 文档（您在问题中链接的文档）：

Style keys are camelCased in order to be consistent with accessing the properties on DOM nodes from JS (e.g. node.style.backgroundImage).

glyphicon 在 JSX 中添加边距

glyphicon add margin in JSX

glyphicons

reactjs