Tài liệu Styling of Form Elements

Forms have a big impact on our day-to-day Internet lifestyle, so designers want to
control the look-and-feel of form elements in their web page designs. The problem is
that browsers manipulate the visual display of form elements from one browser to the
next. Even the same browser version can display a form element differently on separate
operating systems.
To help web developers determine the best way to design web forms, this appendix
documents a majority of the visual CSS properties and their effect on form elements in
today’s modern browsers.
The first part of this appendix lists the properties that were tested and their respective
values in Table D-1.
The second part examines eight form elements and how they can be modified using 20
of the CSS properties listed in Table D-1 in 10 different browsers:
ã Checkboxes, are shown in Table D-2 and Figures D-1 to D-20.
ã File Upload, is shown in Table D-3 and Figures D-21 to D-40.
ã Radio Buttons, are shown in Table D-4 and Figures D-41 to D-60.
ã Input Text, is shown in Table D-5 and Figures D-61 to D-80.
ã Select with Multiple Items, is shown in Table D-6 and Figures D-81 to D-100.
ã Select with Individual Item, is shown in Table D-7 and Figures D-101 to D-120.
ã Submit Button, is shown in Table D-8 and Figures D-121 to D-140.
ã Textarea, is shown in Table D-9 and Figures D-141 to D-160.
The values used from Table D-2 to Table D-9 include NA, Y, N, and S.
NA stands for Not Available meaning that the CSS property does not apply to the form
element, Y for Yes meaning that the CSS property’s value is properly applied, N for No
a meaning that the CSS property’s value was not applied and S for Somewhat meaning
that there is some part of the CSS property’s value being applied.