Pizza Order Form: Focus Styling

Features

• hover and focus styling the similar to harmonize look and feel of styling between interaction techniques.
• focus styling has a border and hover does not.
• focus styling used a 2px border or outline width to make the control with focus salient to users.
• Need to use onfocus and onblur events to create focus styling of radio buttons and checkboxes with their labels.
• Styling background color also makes the change in focus much easier to detect visually.
• Do not set hover styling for select control.

Pizza Form

Name Address Phone Delivery Method Eat in store Pickup Home delivery

Crust

Thin Classic Deep Dish

Toppings

Sausage Pepperoni Mushrooms Onions Green Peppers Back Olives Extra cheese

HTML Source Code

CSS Source Code

Javascript Source Code