CSS样式无法应用于React Native

Question

我正在显示一些弹出视图，它将在图像上显示两个文本。因此，为此，我尝试在字符串中设置css。但是，文本出现在图像的底部。我正在使用融合图库来加载图，一旦用户点击图线，我就会显示一些弹出窗口（工具提示）。该工具提示文本我正在尝试根据我的要求进行自定义  toolText: '<div style={{  position: relative; text-align: center; color: white;}}><div><img height="50" width="50" src="http://www.pngpix.com/wp-content/uploads/2016/10/PNGPIX-COM-Mickey-Mouse-PNG-Transparent-Image-1-500x575.png"></img><div style={{ position: absolute; top: 2px; left: 8px; }}>Sample Text1<div><div style={{ position: absolute; top: 10px; left: 16px; }}>Sample Text2</div></div>',输出如下有任何建议，我想在视图顶部显示文本。

Answer 1

最后，经过一些研发，我找到了解决方案，我没有为图像设置颜色。

希望这对以后的人有所帮助。

  toolText: `<div style="border-top-color: 200px solid #somecolor; margin-right: 2px; background-color:#fff display:outer-block; width:auto; height:60px;"><span><text style="font-size: 12px; margin-left:4px; font-weight: bold;  color:#003A69; margin-top:10px; display:inline-block;"> Sample Text1</text></span>{br}<span><text style="font-size: 12px; color:#003A69; margin-left:4px; font-weight: bold; margin-top:2px; display:inline-block;">Sample Text2</text></span>{br}</div>`,

Answer 2

根据我的理解，React / React Native需要使用驼色框来使选择器名称可识别。

另外，您的html / css的格式应类似于以下格式，以获得所需的叠加效果。

<div style="position: relative;">

    <img>

    <div style="position: absolute;"></div>

    <div style="position: absolute;"></div>

</div>