跟进问题来自：Material UI - hierarchical ordered list
在Material UI中，如果我有这样一个带有标记的列表，
<List sx={{ listStyle: "decimal", pl: 4 }}>
<ListItem sx={{ display: "list-item" }}>
<ListItemText primary="A" />
</ListItem>
<ListItem sx={{ display: "list-item" }}>
<ListItemText primary="List" />
</ListItem>
<ListItem sx={{ display: "list-item" }}>
<ListItemText primary="Item" />
</ListItem>
</List>
1. xxxxx
2. xxxxx
a. xxxxx
b. xxxxx
3. xxxxx
4. xxxxx
a. xxxxx
b. xxxxx我如何使用sx和scss样式标记？例如改变字体，颜色等
谢谢。
1条答案
按热度按时间pokxtpni1#
您的问题包含带有sx的css，并演示了如何使用sx应用样式：
MUI docs有关于如何使用sx的示例。
要使用scss，请将其导入使用样式的文件：
import './styles.scss';像Webpack这样的打包器需要一个special loader来将scss文件读入JavaScript。
scss中使用的选择器（ID、类等）通过使用
id和classNameJSX属性来匹配JSX标记中的选择器：<ListItem id="someId" className="someGlobalClassName" sx={{ display: "list-item" }}>为了避免重复css定义或在每个标签上应用类名，您可以使用MUI组件的全局类名直接针对MUI组件。例如，
<ListItem>标签使用.MuiListItem-root将样式应用到根元素。全局类名在组件的API页面上列出。