HelpBot Assistant

How can I help you?

Customize input and anchor elements in React Button component

2 Mar 20261 minute to read

Native HTML input and anchor elements can be styled using predefined Syncfusion button classes. In the following example, the input element is styled as a link button with the e-btn e-link class, and the anchor element is styled as a primary button with the e-btn e-primary class.

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Syncfusion React Button</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="Essential JS 2 for React Components" />
    <meta name="author" content="Syncfusion" />
    <link href="https://cdn.syncfusion.com/ej2/32.2.3/ej2-base/styles/tailwind3.css" rel="stylesheet" />
    <link href="https://cdn.syncfusion.com/ej2/32.2.3/ej2-buttons/styles/tailwind3.css" rel="stylesheet" />	
    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.38/system.js"></script>
    <script src="systemjs.config.js"></script>
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type ="text/javascript"></script>
</head>

<body>
    <div>
		<input type="button" id="inputbtn" value="Input Button" class="e-btn e-link">
	</div><br>
	<div>
		<a id="anchorbtn" class="e-btn e-primary" href="#">Google</a>
	</div>
</body>

</html>