Day 28 - styled-components 笔记3

Q_Q ..

对预设建立的 component 延伸自订样式

import styled from "styled-components";

const Button = styled.button`
  color: palevioletred;
  font-size: 1em;
  margin: 1em;
  padding: 0.25em 1em;
  border: 2px solid palevioletred;
  border-radius: 3px;
`;

const BlueButton = styled(Button)`
  color: blue;
  border-color: blue;
`;

export default function App() {
  return (
    <section className="App">
      <Button>Normal Button</Button>
      <BlueButton>BlueButton</BlueButton>
    </section>
  );
}