Programming Assignment 1
Fun with HTML forms and style sheets

Due on Tuesday September 17 before midnight
Worth 3% of your final grade


This project must be done individually. No copying is permitted. The goal of this project is to learn HTML Forms and Style Sheets.


You will do this project on your own PC/laptop on any platform. For this project (as well as for all class projects), you have to use the Mozilla Firefox web browser. If you do not have Firefox installed, you can install it from You may find firebug a useful tool for debugging HTML and JavaScript on Firefox.


The following web pages contain various tutorials. Use them as a reference only. The class slides contain enough information on HTML and Styles Sheets.

Project Description

First, you need to download the file (Note: 09/07/2013: I updated this file.) Your project is to edit this file to include more HTML Form widgets that change the CSS properties of some text. You must use a plain text editor to edit this HTML file, such as Notpad, TextEdit, Emacs, etc. Do not use any HTML/web authoring system, such as Dreamweaver or FrontPage. Do not edit/add JavaScript code. Do not post your HTML file on a web server. Instead, you should let your browser download the HTML file as a local file (for example, using a URL that starts with file://, such as file:///C:/WINDOWS/proj1.html on Windows).

More specifically, you need to add at least 15 form widgets in the HTML form to control various aspects of the text displayed below the form. These form widgets must have names that are valid CSS element properties, such as font−family, while the selected value must be a valid value for this property, such as the value Helvetica for font−family. You may use the select widget only to define your menus. You must control various groups of CSS properties, such as for text, font, color, border, margins, etc. You must organize you form inputs in groups, for example, one for changing text properties, another one for changing font properties, etc, with headings and borderlines between them. In other words, your web page must look functional, well-organized, self-explained, and visually appealing.

What to Submit

Use the form below to submit your proj1.html file only. We do not accept email or hardcopy submissions. You need a username and password to submit your project. You should have already received an email from your instructor at your account with your username and password. You may submit multiple files, if you like, as long as they have different names. These files are automatically uploaded directly into your personal class account for this particular project, so you don't have to include your name or student ID or project number in the file name. You may submit your files as many times as you like, but only the most recently submitted files will be retained and evaluated (newly submitted files replace the old files under the same file name). After you submit the files, please double-check that your submitted files are correct by clicking on the Status link and by displaying your submitted file on your browser. If you cannot login or have a problem submitting the project using this form, ask the GTA for help.

Submit Project #1:

Last modified: 09/07/13 by Leonidas Fegaras