Reactjs 中的内联样式
Inline styling in Reactjs
我知道这是一个基本问题,已经问过好几次了。我阅读了大部分与 Reactjs 中的内联样式相关的问题和答案。但是找不到我正在搜索的内容,或者我是 Reactjs 的新手,所以我无法理解他们所说的内容。
我知道内联样式可以像下面这样作为一个对象来实现。
<div className="card" style={{ width: 250, height: 50 }}>My card</div>
我很好奇如何使用上面的内联样式添加具有各种值的框阴影。
例子
boxShadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
我知道我可以使用单独的 CSS 文件,但我只想将此框阴影添加到预定义的 bootstrap 卡片中。
我进行了搜索,但找不到合适的答案。只是想知道这是否可行,如果可行,有什么方法可以做到这一点。
谢谢。
只引用他们的话。
<div style={{
boxShadow: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px"
}} >My card</div>
我知道这是一个基本问题,已经问过好几次了。我阅读了大部分与 Reactjs 中的内联样式相关的问题和答案。但是找不到我正在搜索的内容,或者我是 Reactjs 的新手,所以我无法理解他们所说的内容。
我知道内联样式可以像下面这样作为一个对象来实现。
<div className="card" style={{ width: 250, height: 50 }}>My card</div>
我很好奇如何使用上面的内联样式添加具有各种值的框阴影。
例子
boxShadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
我知道我可以使用单独的 CSS 文件,但我只想将此框阴影添加到预定义的 bootstrap 卡片中。
我进行了搜索,但找不到合适的答案。只是想知道这是否可行,如果可行,有什么方法可以做到这一点。
谢谢。
只引用他们的话。
<div style={{
boxShadow: "rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px"
}} >My card</div>