Reactjs 中的内联样式

问题描述

我知道这是一个基本问题,并已问过多次。我阅读了与 Reactjs 中的内联样式相关的大部分问题和答案。但是找不到我要搜索内容,或者我无法理解他们所说的内容,因为我是 Reactjs 的新手。

我知道内联样式可以实现为如下所示的对象。

<div className="card" style={{ width: 250,height: 50 }}>My card</div>

我只是很好奇如何使用上面的内联样式添加具有各种值的框阴影。

示例 BoxShadow: rgba(0,0.02) 0px 1px 3px 0px,rgba(27,31,35,0.15) 0px 0px 0px 1px;

我知道我可以使用单独的 CSS 文件,但我只想将这个 Box-shadow 添加到预定义的引导卡中。

搜索了但找不到正确的答案。只是想知道这是否可行,如果可行,有什么方法可以做到这一点。

谢谢。

解决方法

只需引用它们即可。

<div style={{ 
  boxShadow: "rgba(0,0.02) 0px 1px 3px 0px,rgba(27,31,35,0.15) 0px 0px 0px 1px" 
}} >My card</div>