Question

Eventbrite给了我一个HTML代码按钮，可以嵌入到我的Thrive Architect网站中。但是，按钮很小，呈灰色，并不突出。因此，我需要将按钮的颜色更改为绿色，并且需要使按钮的尺寸更大。我也想使字体加粗。

这是他们给我的代码，我需要对其进行自定义（我已经尝试了24个小时来对其进行自定义，进行了广泛的研究并以自己的方式进行了尝试，但是每当我更改代码中的任何内容并保存时，它显示在按钮"[/tcb-noscript]

旁边

<!-- Noscript content for added SEO --> <noscript><a href="eventbrite.co.uk/e/…" rel="noopener noreferrer" target="_blank"></noscript> <!-- You can customize this button any way you like --> <button id="eventbrite-widget-modal-trigger-57878905364" type="button">Buy Tickets</button> <noscript></a>Buy Tickets on Eventbrite</noscript>
<script src="eventbrite.co.uk/static/widgets/eb_widgets.js"></…> <script type="text/javascript"> var exampleCallback = function() { console.log('Order complete!'); }; window.EBWidgets.createWidget({ widgetType: 'checkout', eventId: '57878905364', modal: true, modalTriggerElementId: 'eventbrite-widget-modal-trigger-57878905364', onOrderComplete: exampleCallback }); </script>

Answer 1

您只需要添加一些针对此元素的CSS。抓住按钮的ID，并在您希望按钮的外观下方添加。像这样：

#eventbrite-widget-modal-trigger-57878905364 {
  font-size: 2rem;
  background: green;
  color: white;
  border: 0;
  border-radius: 25px;
  padding: 5px 20px;
}

<!-- HTML only cut down for the example -->
<button id="eventbrite-widget-modal-trigger-57878905364" type="button">Buy Tickets</button>

更改HTML Eventbrite按钮的颜色和大小

1 个答案: