CS5281 Midterm Semester B 2020-2021



1. In this question, you’ll work on a simple HTML page as described below:

The page has the title of “Customer Feedback”. It begins with the level-1 heading “Contact Us” and a paragraph (Please leave your message….). Under the paragraph is a table of 3 rows.

The first row contains two cells: The cell on the left contains two radio buttons (called Channel”) for Mobile Phone and Email respectively, on the right is another cell containing just the input box (called “Contact”). Depending on the choice of radio buttons, the value “P” (for phone) or “E” (default, for email) will be sent to the server.

The second row contains the word “Message:” and a multi-line textbox with dimension of 5 rows x 80 columns.

The last row contains the submission button, when clicked, all information will be sent to contact.php on the server. (Content should not be visible in address bar).

a) In your answer, write down the corresponding HTML markup [17 marks]

• Only the content inside <body> is needed

• There is no need to write the paragraph content (Please leave your message….)

• Do not include any CSS in your solution here

   (CSS will be handled in part b)



b) In the space provided, write down the embedded CSS selectors and statements which format the page in part a) as specified. (No marks for inline CSS or HTML style) [17 marks]

• The page uses the background picture Back.jpg

• Level1 headings is converted to capital, italic underlined, in font Monotype Corsiva

• The paragraph is justified on both sides, the first line is shifted right by 3 characters

• The words Contact Method are in blue and bolded. It is separated from the radio buttons by 30 pixels.

• All table cells reserves an internal space of 5 pixels to the internal content.

• All cells contains a border of 4 pixels. The top and left borders are in Ivory color and the border on the right and bottom are in 25% gray



2. Explain the respective meanings of the following CSS statements:


3. With only1-2 sentences, explain the differences between the similar concepts: [6 marks]

a) <input type=”text”> v.s. <textarea>


b) HTML tag used for importing external CSS v.s. the tag for importing external JavaScript 



4. The JavaScript code below intends to read a positive integer from user and then prints the sum of digits. (For instance, if the user input 123, the program prints 6, which is 1+2+3). Somehow the code below doesn’t work as expected, fix the program by replacing the erroneous lines with correct ones. [11 marks]

● Replacement, if any, should only be made in a ONE-TO-ONE manner.

● Write the corrected line on the right of the original line.

● Correction should preserve the original algorithm

   (e.g. not changing the order of steps, not calling other function…etc)

● Leave the line empty if the line is correct and no replacement is needed.



-- END OF QUIZ --