How to make a Themed Checkbox using jQuery Mobile ? Last Updated : 23 Dec, 2020 Comments Improve Suggest changes Like Article Like Report jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Themed Checkbox using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=”stylesheet” href=”http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css” /> <script src=”http://code.jquery.com/jquery-1.11.1.min.js”></script> <script src=”http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js”></script> Example: We will create a Themed Checkbox using jQuery Mobile. We create the checkbox using input type="checkbox" attribute and use data-theme="b" attribute to create a themed checkbox. HTML <!DOCTYPE html> <html> <head> <link rel="stylesheet" href= "http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> <script src="http://code.jquery.com/jquery-1.11.1.min.js"> </script> <script src= "http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </script> </head> <body> <center> <h1>GeeksforGeeks</h1> <h4> Design a Themed Checkbox using jQuery Mobile </h4> <form style="width: 50%;"> <fieldset data-role="controlgroup" data-iconpos="right"> <input type="checkbox" name="groupcheckbox1" id="groupcheckbox1" data-theme="b"> <label for="groupcheckbox1">Geeks</label> <input type="checkbox" name="groupcheckbox2" id="groupcheckbox2" data-theme="b"> <label for="groupcheckbox2">GeeksforGeeks</label> <input type="checkbox" name="groupcheckbox3" id="groupcheckbox3" data-theme="b"> <label for="groupcheckbox3">GFG</label> <input type="checkbox" name="groupcheckbox4" id="groupcheckbox4" data-theme="b"> <label for="groupcheckbox4">Computer</label> </fieldset> </form> </center> </body> </html> Output: Comment More infoAdvertise with us Next Article How to make a Themed Checkbox using jQuery Mobile ? P ppatelkap Follow Improve Article Tags : Web Technologies JQuery jQuery-Mobile Similar Reads How to make a Icon position Checkbox using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating an Icon position Checkbox using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=âstyles 1 min read How to make a Disabled Checkbox using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Disabled Checkbox using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=âstylesheetâ 1 min read How to make a Themed Radio Button using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Themed Radio Button using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=âstylesheet 1 min read How to make Check icon using jQuery Mobile ? jQuery Mobile is a web-based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be making Check icon using jQuery Mobile. Approach: First, add jQuery Mobile scripts needed for your project. <link rel="stylesheet" hre 1 min read How to make a Shadow Button using jQuery Mobile? jQuery Mobile is a web-based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be making a Shadow Button using jQuery Mobile. We will be using different types of UI classes and types to make up the markup buttons.Examp 1 min read Like