问题描述
我们在SharePoint现代页面的一个部分中添加了4个“快速链接” Web /应用程序部分。我们只想突出显示“快速链接Web部件2”和“快速链接Web部件4”下的链接。我添加了React现代脚本编辑器。我们如何使用CSS归档上述要求?如果CSS不可能,那么我们想介绍JS。除了GUID,我找不到可以抓住并应用CSS的固定标签名称。
解决方法
您可以尝试通过SPFX注入CSS。
查看hugoabernier共享的演示。
主要代码:
export default class InjectCssApplicationCustomizer
extends BaseApplicationCustomizer<IInjectCssApplicationCustomizerProperties> {
@override
public onInit(): Promise<void> {
Log.info(LOG_SOURCE,`Initialized ${strings.Title}`);
const cssUrl: string = this.properties.cssurl;
if (cssUrl) {
// inject the style sheet
const head: any = document.getElementsByTagName("head")[0] || document.documentElement;
let customStyle: HTMLLinkElement = document.createElement("link");
customStyle.href = cssUrl;
customStyle.rel = "stylesheet";
customStyle.type = "text/css";
head.insertAdjacentElement("beforeEnd",customStyle);
}
return Promise.resolve();
}
}