24 beautiful personalized HTML Forms

Document directory

• Checkbox related to radio buttons
• 7.) Some articles used to customize the checkbox and radion button
• Select and drop-down box
• 6.) more select box customization technologies (based on JavaScript)
• More form control objects

HTML form objects are rendered differently in different browsers. Although some objects, such as textbox and textarea, can obtain consistent appearances in different browsers through CSS, most other objects that cannot control the appearance through CSS look very ugly in Some browsers. This article selects 24 techniques for customizing form objects.

Checkbox related to radio buttons 1.) fancyform

Fancyform is a very powerful JavaScript library that can be used as a substitute for checkbox and radio buttons. It can generate very beautiful checkbox and radio buttons and support almost all browsers, this JavaScript library must be supported by the mootools JavaScript framework.

2.) crir: checkbox & Radio input replacement

This JavaScript and CSS combination can hide the checkbox and radio buttons in the form, and allow you to simulate the checkbox and radio buttons using CSS settings for the checkbox and radio buttons. The form function remains unchanged, and the data values of checkbox and radio buttons can still be collected. The labels of checkbox and radio button will trigger hidden objects.

3.) Ryan fait's custom checkboxes & radio buttons

This JavaScript and CSS combination allows you to simulate the checkbox, radio button, and select list controls using your own images. This thoughtful JavaScript library can be automatically used back to the traditional form control when Javascript is disabled in the browser.

4.) arc-Adam's radio/checkbox Customization

This script detects the checkbox, radio buttons, and their labels in the form. Once found, these controls are replaced with CSS style-based graphical labels.

5.) prettycheckboxes

6.) jquery checkbox

7.) Some articles used to customize the checkbox and radion button

• Custom radio button implement with jquery
• Slayeroffice custom checkbox Elements
• Customized HTML controls: creating custom checkbox
• Styled Form Controls
• Fancy checkboxes and radio buttons
• Inside technique: Custom checkboxes

Select and drop-down box 1.) JavaScript image ComboBox (JavaScript graphical ComboBox)

2.) jquery dropdown check list

3.) custom select with icons

4.) comboboxes using mootools

5.) Select replacement

6.) more select box customization technologies (based on JavaScript)

• Mcdropdown jquery plug-in
• Jquery custom select box v.0.01
• Arc90 arc90
• Control. selectmultiple

More form control objects 1) custom form elements (CFE)

Custom form elements integrates various technologies to enhance the XHTML web form control objects. It achieves more beautiful results based on JavaScript and CSS, improving ease of use and accessibility. Supports most mainstream browsers.

2.) emblematiq niceforms

Niceforms is a javascript library that can replace almost all web form objects. You can use the default theme or even develop your own theme.

3.) jquery Plugin: jnice

Source: http://www.netwaver.com/23/24-html-form-elements-customization-techniques/
Source: comsharp CMS official website