使用 CSS

Question

我有一个反应脚本。它的工作原理是这样的，出现数据隐私。它会自动触发，直到人们选择退出。下拉文本的颜色是蓝色，我不明白为什么。但我想把文字颜色改成白色有没有办法给这段代码添加样式并更改文本颜色？

<script>
  window.consentManagerConfig = function(exports) {
    var React = exports.React
    var inEU = exports.inEU

    var bannerContent = React.createElement(
      'span',
      null,
      'Wir verwenden Cookies (und andere ähnliche Technologien), um Daten zu sammeln und Ihre Erfahrung auf unserer Website zu verbessern. Durch die Nutzung unserer Website erklären Sie sich mit der Erfassung von Daten, wie in unserer Datenschutzerklärung beschrieben, einverstanden. | We use cookies (and other similar technologies) to collect data to improve your experience on our site. By using our website, you՚re agreeing to the collection of data as described in our',
      ' ',
      React.createElement(
        'a',
        { href: 'https://www.top.legal/de/datenschutz', target: '_blank' },
        'Datenschutzerklärung | Data Privacy Policy'
      ),
      '.'
    )
    var bannerSubContent = 'Sie können Ihre Einstellungen jederzeit ändern. | You can change your preferences at any time.'
    var preferencesDialogTitle = 'Website-Datenerfassungspräferenzen | Website Data Collection Preferences'
    var preferencesDialogContent =
      'Wir verwenden die von Cookies und JavaScript-Bibliotheken gesammelten Daten, um Ihr Browsing-Erlebnis zu verbessern, den Website-Verkehr zu analysieren, personalisierte Werbung auszuliefern und die Gesamtleistung unserer Website zu steigern. | We use data collected by cookies and JavaScript libraries to improve your browsing experience, analyze site traffic, deliver personalized advertisements, and increase the overall performance of our site.'
    var cancelDialogTitle = 'Sind Sie sicher, dass Sie abbrechen möchten? | Are you sure you want to cancel?'
    var cancelDialogContent =
      'Ihre Einstellungen wurden nicht gespeichert. Indem Sie unsere Website weiter nutzen, stimmen Sie unserer Richtlinie zur Datenerfassung auf der Website zu. | Your preferences have not been saved. By continuing to use our website, you՚re agreeing to our Website Data Collection Policy.'
      
    return {
      container: '#opt-in',
      writeKey: 'xH4L6pDELr0qFKjutaGXDqPt9tExOM0n',
      shouldRequireConsent: inEU,
      bannerContent: bannerContent,
      bannerSubContent: bannerSubContent,
      preferencesDialogTitle: preferencesDialogTitle,
      preferencesDialogContent: preferencesDialogContent,
      cancelDialogTitle: cancelDialogTitle,
      cancelDialogContent: cancelDialogContent
    }
  }
</script>

Answer 1

使用 CSS

您所说的“下拉菜单”似乎是一个 <span>，里面有一个 <a>。

您应该使用 CSS 来设置这些元素的样式。

<span> 通常不会尝试设置其文本颜色，但默认情况下 <a> 元素确实会从浏览器接收一些特殊样式。这些样式很容易被覆盖。

首先，你的“下拉菜单”的最外层元素应该有一个好的类名，这样这些特殊的样式就可以针对它而不是别的。在我的示例中，我假设您已将“gdpr-notice”类分配给最外层的 <span>。

.gdpr-notice a,
.gdpr-notice a:visited {
    color: white;
}

Answer 2

您可以通过将 id 或 class 添加到您的链接元素来更改颜色。例如：

var bannerContent = React.createElement(
      'span',
      null,
      'Wir verwenden Cookies (und andere ähnliche Technologien), um Daten zu sammeln und Ihre Erfahrung auf unserer Website zu verbessern. Durch die Nutzung unserer Website erklären Sie sich mit der Erfassung von Daten, wie in unserer Datenschutzerklärung beschrieben, einverstanden. | We use cookies (and other similar technologies) to collect data to improve your experience on our site. By using our website, you՚re agreeing to the collection of data as described in our',
      ' ',
      React.createElement(
        'a',
        { href: 'https://www.top.legal/de/datenschutz', target: '_blank', id: 'data-privacy-policy' },
        'Datenschutzerklärung | Data Privacy Policy'
      ),
      '.'
    )

然后是css

#data-privacy-policy { color: white }

反应脚本中的文本颜色更改

2 个答案:

使用 CSS