styled-components 没有样式 <hr /> 元素

Question

我正在尝试制作一条线，但 styled-components 出错，整个页面都没有呈现。

这是代码

//using styled-components

export const Line = styled.hr`
  color: rgba(0, 0, 0, 0.65);
  marginleft: -100;
`;

这是浏览器控制台中显示错误的屏幕截图。

Answer 1

标签 hr 不能有 children。你可以将 hr 与 styled-components 一起使用，以防它不 children。你就这样使用它：<Line /> 不是这样的：<Line>Hello</Line> 您的代码行必须像这样：

const Line = styled.hr`
  color: rgba(0, 0, 0, 0.65);
  margin-left: -100px;
`;

styled-components does not style <hr /> element