React更改div中所有子项的字体文本颜色
React更改div中所有子项的字体文本颜色
提问于 2019-02-22 04:22:49
我将渲染函数设置为如下所示
<div
dangerouslySetInnerHTML={{
__html: page.content.rendered
}}
/>我从外部应用程序接口中将页面作为prop获取，page.content.rendered将是字符串形式的html，如下所示：
<div>
<h2> this is title </h2>
<p> hello </p>
</div>有没有办法改变div元素中所有子元素的文本颜色？
我尝试向外部div元素添加color："somecolor“，但没有任何变化。
回答 4
Stack Overflow用户
发布于 2019-02-22 04:25:28
<div style={{"color": "red"}}>
<h2> this is title </h2>
<p> hello </p>
</div>Stack Overflow用户
发布于 2019-02-22 04:25:35
您可以设置任何父元素的样式，它将应用于其子元素。https://reactjs.org/docs/dom-elements.html#style
例如：
<div
style={{color:'red'}}
dangerouslySetInnerHTML={{
__html: page.content.rendered
}}
/>有许多样式解决方案执行得更好，并且得到了社区的良好支持：https://reactjs.org/docs/faq-styling.html
Stack Overflow用户
发布于 2019-02-22 04:31:22
在JSX中设置样式的方式与在HTML中相同，您可以在外部CSS文件中创建类，然后执行以下操作：
import './style.css';
<div className='.myClass'
dangerouslySetInnerHTML={{
__html: page.content.rendered
}}
/>或者，您可以像这样做内联样式：
<div style={{color:'red'}}
dangerouslySetInnerHTML={{
__html: page.content.rendered
}}
/>在我看来，在React中使用内联样式非常奇怪。我更喜欢导入CSS文件或使用Tachyons之类的库，并使用JSX className。
你可以在类似的帖子here中找到更多帮助。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54815633
复制相关文章
相似问题