时间戳

首页 > 解决方案 > 如何更改 eventbrite 嵌入按钮和悬停颜色的颜色？

css - 如何更改 eventbrite 嵌入按钮和悬停颜色的颜色？

问题描述

不知道如何使按钮颜色变化以及悬停颜色变化。请让我知道如何将其编码到 WordPress 的文本编辑器/ CSS 中。下面是给出的嵌入代码。

<noscript><a href="https://www.eventbrite.com/e/test-1-tickets-53170478332" rel="noopener noreferrer" target="_blank"></noscript>
<button id="eventbrite-widget-modal-trigger-53170478332" type="button">BUY NOW</button>
<noscript><strong></a>Buy Tickets on Eventbrite</strong></noscript>

标签： csswordpress

解决方案

添加<style>-tag 并为您的按钮 ID 添加 CSS 样式。如果您想使用多个按钮，也可以创建一个类。

在此示例中，您的 ID 为：eventbrite-widget-modal-trigger-53170478332

然后为该 ID 或您创建的类编写样式。

<noscript><a href="https://www.eventbrite.com/e/test-1-tickets-53170478332" rel="noopener noreferrer" target="_blank"></noscript>
<button id="eventbrite-widget-modal-trigger-53170478332" type="button" >BUY NOW</button>
<noscript><strong></a>Buy Tickets on Eventbrite</strong></noscript>
<style>
#eventbrite-widget-modal-trigger-53170478332 {
border: none; 
background: darkorange; 
color: #FFF;
border-radius: 4px;
transition: all 300ms linear;
cursor: pointer;
padding: 0.5em;
}
#eventbrite-widget-modal-trigger-53170478332:hover {
background: red; 
}
</style>

推荐阅读