Skip to content
csH2019paper
Share
Explore
section 2

icon picker
q-12

ScotDance is a dance school which provides classes for children. A website is being created to display information about the dance school and to allow people to contact them, book classes or hire the studio.
part a
The main element of the home page is to have the same CSS styles applied to it as the header element with the exception of the CSS rule to set the height. The height rule should only be applied to the header element. The CSS rule applied to the header element at present is shown below.
header {
background-color:white;
margin-top:20px;
margin-bottom:20px;
height:90px;
}
Write the new CSS rules required to style both the header and main elements in the most efficient way. Your answer should include the use of grouping selectors.
(edit the style.css file)
part b
The Studio Hire web page should include a form for online booking. When using the form, customers will need to submit the following information.
Name
Mobile number
Date required
Session (morning, afternoon or evening)
Additional information (max 400 characters)

Using this information, draw a wireframe design for the form on the Studio Hire web page.
A form on the Contact Us web page is created using the HTML code shown below.
<form>
Name:
<input type="text" name="name" size="40" required><br><br>

Email Address: <input type="text" name="email" size="45" maxlength="5" required><br><br>

Age of Child:
<input type="radio" name="age" value="<=5" > 5 and under
<input type="radio" name="age" value="6-10"> 6 - 10
<input type="radio" name="age" value="11-14"> 11 - 14
<input type="radio" name="age" value="15+" > 15+
<br><br>

Class Interested In:
<select name="choiceOfClass">
<option value="ballet">Ballet</option>
<option value="modern">Modern</option>
<option value="tap">Tap</option>
</select>
<br><br>

Further comments:<br>
<textarea name="comment" rows="5" cols="62" maxlength="500"> </textarea>
<br><br>

How many days per week do you want your child to train?
<input type="number" name="days">
<br><br>

<input type="submit" onclick="alert('Form Entered')" value="Submit"><br><br>

</form>
part c
State the type of validation used when inputting the ‘Name’.
part d
It is important that the website is fully tested and evaluated. Testing should include checking that all input validation works correctly. When testing the form, two errors are found.
(i) When entering the number of days per week for training, a user can enter any number.
Re-write the code so that the number of days entered is restricted to between 1 and 7 inclusive.
(ii) There is also an error on the email field. State the change required to the HTML code to ensure that most email addresses can be entered on the form.


Loading…


Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.