在SharePoint现代页面上的“快速链接” Web部件中突出显示链接

问题描述

我们在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();
  }
}