Javascript 如何在 React 中绘制红色水平线
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/48156902/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I draw red horizontal line in React
提问by sleatrou
How can I draw a horizontal line (hr) in a react component using dynamic color?
如何使用动态颜色在反应组件中绘制水平线(hr)?
Here's what I have so far:
这是我到目前为止所拥有的:
render {
let color = 'red';
return (
<div>
There is a red HR
<hr />
<div>
)
}
回答by Luke
One way to set up the component:
设置组件的一种方法:
const ColoredLine = ({ color }) => (
<hr
style={{
color: color,
backgroundColor: color,
height: 5
}}
/>
);
And then use it with:
然后将其用于:
<ColoredLine color="red" />
For a full breakdown on how to style <hr />, see http://www.sovavsiti.cz/css/hr.html
有关如何设计样式的完整分类<hr />,请参阅http://www.sovavsiti.cz/css/hr.html
回答by Jojo Joseph
<hr style={{
color: '#000000',
backgroundColor: '#000000',
height: .5,
borderColor : '#000000'
}}/>
Only adding the borderColor, to change the exact full-color change of <hr />tag
仅添加borderColor, 以更改<hr />标签的确切全色更改

