Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > CSS

  • Print
  • + Share This
Like this article? We recommend

Adding the Classes

After you set up your classes, it’s time to set up your form. Don’t worry about making it look pretty in the HTML code (that’s what the CSS is for), but do use the for attribute with labels to associate them with a form field.

<label for="firstName">Name</label>
              <input class="formInputText" type="text" name="firstName" id="firstName" value="First" size="12" maxlength="16" tabindex="1" onfocus="clearField(this)" />

I’m also using a simple JavaScript function that allows me to prepopulate the value of the field and then erase it when the user clicks in the field.

function clearField(obj) {
    if (obj.defaultValue==obj.value) obj.value = ’’;

Of course, this technique can also be used to add further dynamic interactivity with the form.

  • + Share This
  • 🔖 Save To Your Account