Assignment #3 – Pizza!
Create a page for a pizza company where you will have an order form. When saving your page, be sure to choose an appropriate filename. At the top of your page, display the name of your pizza shop, a slogan, and an image. You can display your shop’s name using h1 and your slogan using h2. Feel free to style those headings.
Create a pizza ordering form with the following fields:
· Name: textbox (you don’t need to have separate fields for first and last names)
· Phone: textbox
· Size: select box
o The user viewing your page should see: Small ($10), Medium ($13), Large ($16)
o The values to get passed to the script should be 10, 13, and 16
· Toppings: checkboxes for: Mushrooms, Olives, Sausage
· Special requests: text area
· “Would you like to be added to our e-mailing list?” Radio button with options for yes/no
· Submit button that says: Submit My Order!
o Obviously your form won’t do anything at the moment. We’ll begin this topic next week.
· Style your form as follows:
o Give the form a width of 300px. Place a border around the entire form.
o Textboxes: give the background color a light gray
o Button: background-color blue and foreground color of yellow. (Any shade of blue/yellow is fine).
· Have a div section with an id called header not to be confused with the head section! This section should contain the compay name, the slogan, and the image.
· Have a div section called footer with the address and phone number of your company.
o Using a CSS style, make the text of your footer section smaller and center it on the page. Also change the font, set a background color and give it a border.
· Have a div section called main_content that encloses everything else, i.e. everything between the header and footer sections.
And always remember
· ZIP all files (html files and any associated files such as images) and attach under assignment #3 on COL.
o Under ‘Edit Submission Details’, click on the ‘Browse’ button and attach the zip file.
· Upload the file to the server the enter the URL under the comments section.
· Also remember that COL will stop accepting submissions at the deadline – so be sure not to wait until the last minute to turn it in!
· Remember to check your checklist! E.g. Colors must be in hex codes, etc.