Scribd
Upload
42 views1 page

Lab Week 10

This document provides instructions for a lab exercise on using forms in HTML and CSS. The exercises include using a table to align form elements, styling a form with CSS, adding accessibility features like fieldsets and labels, and including HTML5 input types like email, date, and files. Students are advised to complete all exercises during the lab and save their work, as the lab assignments may be examined in the course.

Uploaded by

sarah smith
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
42 views1 page

Lab Week 10

This document provides instructions for a lab exercise on using forms in HTML and CSS. The exercises include using a table to align form elements, styling a form with CSS, adding accessibility features like fieldsets and labels, and including HTML5 input types like email, date, and files. Students are advised to complete all exercises during the lab and save their work, as the lab assignments may be examined in the course.

Uploaded by

sarah smith
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

University of Mauritius

Computer Science and Engineering Department


CSE2026Y Information Systems Innovations and Web Technologies
Lab exercise

Week 10

At the end of this lab session, you should be able to

• Use the form element


• Align form elements using a table
• Align form elements using CSS
• Apply accessibility features to a form
• Apply some HTML5 input elements

As far as possible, you should aim at completing all lab exercises in the lab itself. Students should
note that all lab works may be examinable and your lecturer will verify satisfactory completion of
each lab work every week. In this respect, save all completed work.

Exercise 1

This exercise is a follow-up from lab sheet 9. For the form you created in lab sheet 9, use
a table to organize all form controls such that the controls are well aligned. The table
should contain no border and should have a background color.

Exercise 2
This exercise is a follow-up from lab sheet 9. For the form you created in lab sheet 9, use
an external CSS to style your form such that all controls are well aligned. As discussed in
the lecture, you should use <label> for each control and appropriate selectors to apply the
correct style.

Exercise 3

Enhance your form created in exercise 2 by adding the following accessibility features:
fieldset, legend, tabindex, and accesskey. You would have used label already in exercise
2.

Exercise 4
Let us add some HTML5 controls to your form. Add appropriate input controls for
Email, URL, telephone numbers, datalist, slider. Spinner, calendar and file.

|End of lab exercise – week 10

Lab  sheet  prepared  by  Dr.  M.  Y.  Chuttur.  Document  can  be  shared  and  used  for  educational  purpose  only.   1  

You might also like