Browse Source

Small cleanup to style tips

main
Paul O’Shannessy 11 years ago
parent
commit
47d5b9c302
  1. 4
      tips/02-inline-styles.md

4
tips/02-inline-styles.md

@ -7,7 +7,7 @@ next: if-else-in-JSX.html
prev: introduction.html
---
In React, inline styles are not specified as a string, but as an object whose key is the camelCased version of the style name, and whose value is the style's value in string:
In React, inline styles are not specified as a string. Instead they are specified with an object whose key is the camelCased version of the style name, and whose value is the style's value, usually a string ([more on that later](/react/tips/style-props-value-px.html)):
```js
/** @jsx React.DOM */
@ -21,4 +21,4 @@ var divStyle = {
React.renderComponent(<div style={divStyle}>Hello World!</div>, mountNode);
```
Style keys are camelCased in order to be consistent with accessing the properties using node.style.___ in DOM. This also explains why WebkitTransition has an uppercase "W".
Style keys are camelCased in order to be consistent with accessing the properties on DOM nodes from JS (e.g. `node.style.backgroundImage`). Vendor prefixes should begin with a capital letter. This is why `WebkitTransition` has an uppercase "W".

Loading…
Cancel
Save