- Using Html5 And Css3 Create A Page With A Form As Shown Below Visitor Sex Montreal Tourism A Trip Evaluator For A V 1 (78.99 KiB) Viewed 34 times
1. To ensure more uniformity in different browsers, you arerequired to reset CSS before defining the style.
2. The color of the frame is cyan and, when the browser allowsit, the color has a gradient from cyan to color #00DDDD in thedirection top-left to bottom-right. Its width is 400px and it mustbe horizontally centralized. The top side of the frame must be 20pxaway from the top side of the web page. The corners of the framemust be rounded by 5px.
3. The frame must have an internal shadow on the top and leftside. The displacement of the shadow must be 1px horizontally and1px vertically. The blur must be of 4px and the color #999999.
4. The top heading must have a font size of 30px, be in bold andbe centered. It must be 10px below the top side of the frame.
5. The second heading must have a font size of 20px, be in boldand be centered. It must be 30px away from the top heading.
6. The form itself is 30px below the second heading. It isorganized as two columns, followed by two buttons. Each cell has aninternal margin of 10px and with vertical alignment by the top. Thecells in the first column have width of 90px and the left internalmargin is 20px.
7. When the cursor is over an item of the form, the text of theitem (in cells in both columns) must become bold (but the inputelements must not move). The transition to bold and back to normalmust take approx. 0.7s.
8. In the first item, the textbox must have a size of 30characters and support a text having up to 50 characters. Themessage “your name” in the textbox must disappear as soon as theuser starts typing in the textbox. Round cases are radio buttonsand square cases are check boxes. “Number:” corresponds to adrop-box with options 1 to 6. “Duration:” corresponds to a drop-boxwith options 1 to 15. “Hotel:” corresponds to a drop-box withoptions 1 star to 5 stars, being 3 stars the default. “Room Type”corresponds to a scroll box with the options “Single room”,“Semi-suite” and “Suite”. All of them are visible and “Semi-suite”is the default.
9. Both in the items “Sex” and “Activities” the radio button andcheckboxes can be chosen also by clicking on the text to theright.
10. The button “Evaluate” is to submit the form and the button“Reset” to clean all the answer and return the form to its initialstate. Each of those two buttons must have a margin of 20px.
Using HTML5 and CSS3 create a page with a form as shown below: Visitor: Sex: Montreal - Tourism A trip evaluator for a visit Number: Duration: Hotel: Room Type: Activities: Evaluate your name Male Female persons days 3 stars Single room Semi-suite Suite City-bus-tours Can$ 20 Spa-Manage Can$ 100 Sport Event Can$ 150 Reset