首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何更改fabric-ui中的字体

如何更改fabric-ui中的字体
EN

Stack Overflow用户
提问于 2018-12-14 06:40:53
回答 3查看 3.7K关注 0票数 0

仅仅将className添加到标记中没有任何帮助

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
                        <p className="ms-font-m">
                            sometext
                        </p>

不会更改字体

https://developer.microsoft.com/en-us/fabric#/styles/typography

EN

回答 3

Stack Overflow用户

发布于 2018-12-18 01:27:49

如果您想要直接使用Fabric Core CSS类,而不是CSS-in-JS,则需要按照getting started with Fabric Core的说明在页面上包含CSS

  1. 在页面的<head>中添加对样式表的引用。最简单的方法是使用微软CDN上的副本(直接从上面链接的文档中抓取URL以获得最新版本):

<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/10.0.0/css/fabric.min.css">

  1. ms-Fabric类添加到一个包含元素中,如<body>,以设置字体系列。然后,您可以使用其他类来设置大小和颜色:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<body class="ms-Fabric">
  <span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>
</body>
票数 1
EN

Stack Overflow用户

发布于 2018-12-17 19:58:03

不完全是我想要的,但这里有一种方法:

https://github.com/OfficeDev/office-ui-fabric-react/blob/86337324a5fd8b522855eb8bdcbf012a868a26ba/packages/styling/README.md#using-fabric-core-classes

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
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://github.com/OfficeDev/office-ui-fabric-react/blob/1b9405b3b64839975e16ee1fad04d7868d9e3b99/packages/styling/src/styles/fonts.ts

可视化字体:https://developer.microsoft.com/en-us/fabric#/styles/typography

颜色:https://developer.microsoft.com/en-us/fabric#/styles/colors

票数 0
EN

Stack Overflow用户

发布于 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

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/53774662

复制
相关文章
字体更改
其中@font-face相当于创建一个字体族,然后下边body部分是在应用字体族,那个名字其实就是在前边创建的字体的名字。 通过在网络上的查找,我首先选择使用的是Robot字体,这个字体族写的英文字体相当漂亮:
爱编程的小明
2022/09/06
3.6K0
字体更改
更改WordPress主题全局字体
加入以下自定义CSS即可 /* 您可以在此处加入您的CSS。 点击上方的帮助图标来了解更多。 */ /*字体设定*/ *:not([class*="icon"]):not(i) { font-family: "Helvetica Neue", "Luxi Sans", "DejaVu Sans", Tahoma, "Hiragino Sans GB", "Microsoft Yahei", sans-serif !important; } /*字体阴影*/ *{text-shadow: 0
回忆大大
2021/08/09
1.2K0
更改WordPress主题全局字体
为Typecho站点更改好看的字体
今天有个访客在我博客里逛了好久,问我“你的站字体怎么这么好看啊?”“能不能教教我啊?”,好吧,那我就勉为其难出个教程吧!这篇文章适用于handsome主题,如果不是这个主题的,请移步百度搜索“网站更换字体代码”,最后替换一下链接即可!
小屁的博客
2022/05/13
1.3K0
为Typecho站点更改好看的字体
为Typecho站点更改好看的字体
今天有个访客在我博客里逛了好久,问我“你的站字体怎么这么好看啊?”“能不能教教我啊?”,好吧,那我就勉为其难出个教程吧!这篇文章适用于handsome主题,如果不是这个主题的,请移步百度搜索“网站更换字体代码”,最后替换一下链接即可!
小屁的博客
2022/08/30
1.2K0
为Typecho站点更改好看的字体
如何永久更改VS编译器字体以及背景色
在VS编译器里,假如不想使用初始化的字体,以及背景颜色的话,该如何更改呢? 1、点击菜单栏工具,再点击选项 2、在选项里找到环境,将其展开 3、点击字体与颜色,在右边就可以更改字体以及背景色了 更改后点击确定,这样以后再次创建时,就默认更改后的了。
诺诺的包包
2023/02/17
1.5K0
如何永久更改VS编译器字体以及背景色
Android系统更改状态栏字体颜色
原文地址:http://blog.isming.me/2016/01/09/chang-android-statusbar-text-color/,转载请注明出处。 随着时代的发展,Android的状态栏都不是乌黑一片了,在Android4.4之后我们可以修改状态栏的颜色或者让我们自己的View延伸到状态栏下面。我们可以进行更多的定制化了,然而有的时候我们使用的是淡色的颜色比如白色,由于状态栏上面的文字为白色,这样的话状态栏上面的文字就无法看清了。因此本文提供一些解决方案,可以是MIUI6+,Flyme4+
非著名程序员
2018/02/02
2.5K0
如何在系统中添加字体(添加字体到系统)
笔者最近在使用win10自带的OneNote笔记本记笔记的时候,发现笔者电脑中没有华文新魏这个字体,最开始以为是OneNote不带有这个字体,经过一段时间的收集资料后发现,是笔者电脑win10系统中不带有这个字体,现将有关概念和字体安装方法做一下记录。
全栈程序员站长
2022/08/01
4K0
如何在系统中添加字体(添加字体到系统)
Flutter中如何设置全局字体
首先在项目中创建fonts目录,然后将将ttf文件放到该目录下,然后在pubspec文件中添加该字体文件,如:
BennuCTech
2022/11/11
3K0
Flutter中如何设置全局字体
【最全】为Typecho站点更改好看的字体-ProMax
这篇文章是我在下课的时候偷偷抽时间出来写的,希望大家认真看完~<img src="https://cdn.xxhzm.cn/1839069011/img/emotion/aru/meditation.png" class="emotion-aru">
小屁的博客
2023/02/06
1.6K0
网络字体@font-face 如何处理网页中的特殊字体
HTML5学堂:随着网页的发展,网页中出现了越来越多的字体种类,网页自带的微软雅黑、宋体、黑体已经越来越难以满足设计的需要,那么,如何在网站中使用比较特殊的字体,又不会下载太大的字体文件,来装饰我们网站的部分呢?一起来看看我们CSS3的新功能吧! 如何在网站中使用比较特殊的字体 随着网页的发展,网页中出现了越来越多的字体种类,原有的微软雅黑以及宋体早就无法满足设计的需要,那么,如何在网站中使用比较特殊的字体(如“华文行楷”)来装饰我们网站的部分呢?作为前端开发的人员都知道,在自己电脑上安装字体查看网页没有什
HTML5学堂
2018/03/12
7K1
网络字体@font-face 如何处理网页中的特殊字体
使用纯CSS代码更改WordPress全站字体
不少博主喜欢美化自己的博客,而一个好看的字体可以让人眼前一亮,还可以提高阅读舒适度。作为一个二次元类(伪)的博客怎么能没有一个可爱的字体呢?
Daimon
2022/03/11
1.9K0
如何在Linux中更改SSH端口?
SSH(Secure Shell)是一种安全的远程登录协议,它允许您通过网络远程连接到Linux系统并进行管理操作。默认情况下,SSH使用22端口进行通信。然而,为了增强系统的安全性,有时候我们需要更改SSH端口,以减少潜在的攻击。
网络技术联盟站
2023/05/25
9.5K0
如何在Linux中更改SSH端口?
更改PPT所有页面字体与页面颜色的技巧
在评估期间,无心插柳地探索到一个新技术,就是关于PPT课件统一更改字体颜色和页面背景颜色的问题。
用户1191760
2019/02/27
5.6K0
原创|keil中更改代码字体/颜色,设置自己酷炫编程界面
首先在keil 的安装文件夹下找到global.prop文件,小代我的keil 是5版本,默认的安装路劲如下:C:\Program Files\Keil_v5\UV4\global.prop。找到global.prop文件用记事本打开,打开后找到如下图红框部分,框里部分就是我们要替换的部分,复制后文中任何一种方案替换掉下图红框里的内容,保存就ok 了,完了打开keil 软件看看,是不是很酷炫啊。
单片机技术宅
2020/03/17
13.1K0
Visual Studio Code 更改侧边栏字体样式(CSS)
Visual Studio Code(以下简称 VSCode) 窗口放大以后侧边栏的字体样式异常难看,让人感到非常别扭,bdfs 也找不到完整的解决方案,最后在知乎看了 muxu.jiu 的回答,茅塞顿开,决定写一篇详细的教程。
Skykguj
2022/09/09
3.3K0
Visual Studio Code 更改侧边栏字体样式(CSS)
KlayGE中的字体
官方文档参见:http://klayge.sourceforge.net/html/font_in_klayge.html
逍遥剑客
2019/02/20
1.5K0
pycharm修改镜像源_pycharm更改字体大小
1.国内常用的镜像源 清华:https://pypi.tuna.tsinghua.edu.cn/simple 中国科技大学 https://pypi.mirrors.ustc.edu.cn/simple/ 2.pip下载时例子之如何使用这些镜像: pip install pygame -i https://pypi.tuna.tsinghua.edu.cn/simple 在文件后加-i 镜像地址 如何在pycharm中修改自己的镜像源:
全栈程序员站长
2022/09/27
1.4K0
pycharm修改镜像源_pycharm更改字体大小
点击加载更多

相似问题

如何更改弹弓中的字体

11

如何更改表中的字体

14

如何更改SpTextPresenter中的字体?

13

如何更改Prawn中的字体

43

如何更改DataGrid中的字体?

20
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文