• styled-components是針對react中一個前端廣泛使用的css-in-js樣式庫
• B站

利用標簽模版

1. 利用ES6中的 標簽模版文檔
2. 標簽模板其實不是模板，而是函數調用的一種特殊形式。“標簽”指的就是函數，緊跟在后面的模板字符串就是它的參數。

let a = 5;
let b = 10;tag`Hello ${ a + b } world ${ a * b }`;
// 等同于
tag(['Hello ', ' world ', ''], 15, 50);

具體原理

• 鏈式調用

const Title = styled h1`
font-size: 1.5em;
text-align: center;
color: #0F$4F74;
`;

1. styled 是一個函數 它會返回一個對象(鏈式調用)
2. h1 是1返回的對象的里面的一個函數.返回的還是1.返回的對象