在spfx webpart中使用内联css

Question

我正在尝试在html内容中使用内联css，但它会显示您在下面的图片中看到的错误;

如何在spfx webpart中使用内联css？

Answer 1

＆＃13;

＆＃13;

<div className={`ms-Grid-col ms-u-md3`} style={{"border-color": "black"}}>
//Some Code
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

这样做不是一个好习惯。您应该更好地使用sass文件并在那里定义您的样式。由于这不是HTML，而是JSX，你可以这样做：

var style = {
      color: 'white',
      fontSize: 200
    };

return <div style={style}> Have a good and productive day! </div>;

但不建议这样做。代码片段不是我的，但是从这篇文章React.js inline style best practices

中获取

Answer 3

简单的方法如下，