仅仅将className
添加到标记中没有任何帮助
<p className="ms-font-m">
sometext
</p>
不会更改字体
https://developer.microsoft.com/en-us/fabric#/styles/typography
发布于 2018-12-18 01:27:49
如果您想要直接使用Fabric Core CSS类,而不是CSS-in-JS,则需要按照getting started with Fabric Core的说明在页面上包含CSS
<head>
中添加对样式表的引用。最简单的方法是使用微软CDN上的副本(直接从上面链接的文档中抓取URL以获得最新版本):<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/10.0.0/css/fabric.min.css">
ms-Fabric
类添加到一个包含元素中,如<body>
,以设置字体系列。然后,您可以使用其他类来设置大小和颜色:<body class="ms-Fabric">
<span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>
</body>
发布于 2018-12-17 19:58:03
不完全是我想要的,但这里有一种方法:
import {
ColorClassNames,
FontClassNames
} from '@uifabric/styling';
function renderHtml() {
return (
`<div class="${ [
ColorClassNames.themePrimary,
FontClassNamed.medium
].join(' ') }">Hello world!</div>`
);
}
我对https://github.com/OfficeDev/office-ui-fabric-react/wiki/Component-Styling#styling-best-practices的理解是,我需要使用getTheme()
和styles
(而不是style
)属性函数来实现新的样式设置方式。因此,我仍在寻找getTheme()
解决方案
==============
以下是可用字体的列表
可视化字体:https://developer.microsoft.com/en-us/fabric#/styles/typography
颜色:https://developer.microsoft.com/en-us/fabric#/styles/colors
发布于 2021-05-26 20:22:14
您可以在加载主题时添加以下代码:
loadTheme({ defaultFontStyle:{ fontFamily:'Comic Sans MS',fontWeight:‘粗体’},.......从office-ui-fabric-react版本7.21.0开始提供此功能
您可以在以下urls中找到bug的发布和报告:https://github.com/microsoft/fluentui/issues/7416 https://github.com/microsoft/fluentui/releases/tag/office-ui-fabric-react_v7.21.0 https://github.com/microsoft/fluentui/pull/9981
https://stackoverflow.com/questions/53774662
复制相似问题