This article has multiple issues. Please help improve it or discuss these issues on the talk page. (Learn how and when to remove these template messages)(Learn how and when to remove this template message)
import styled from 'styled-components'; // Create a component that renders a <p> element with blue text const BlueText = styled.p` color: blue; `; <BlueText>My blue text</BlueText>
- Thinking in components. No longer do you have to maintain a bunch of stylesheets. CSS-in-JS abstracts the CSS model to the component level, rather than the document level (modularity).
- True rules isolation. Scoped selectors are not enough. CSS has properties which are inherited automatically from the parent element, if not explicitly defined
- Vendor prefixing. The CSS rules are automatically vendor prefixed, so you don’t have to think about it.
- Only the styles which are currently in use on your screen are in the DOM.
- Dead code elimination.
This article needs additional or more specific categories. (June 2019)