🟣| Web Design - Implementation

Question 1

Positioning:

Float

Definition

Answer 1

Floating elements to the left or right

Question 2

Positioning:

Display

3

Definition

Answer 2

• Block: element is displayed as a block, generating line breaks before and after.
• Inline: element will be displayed on the same line as the preceding element (if there is space).
• None: element is not displayed.

Question 3

Positioning:

Clear

3

Definition

Answer 3

• Left: no floating elements on the left of the specified element.
• Right: no floating elements on the right of the specified element.
• Both: no floating elements on the left or right of the specified element.

Question 4

Positioning:

Margins

Definition

Answer 4

Sets a margin around a block to separate it from other elements.

Question 5

Positioning:

Padding

Definition

Answer 5

Sets padding within a block to move the contents away from the edge.

Question 6

Positioning:

Height & Width

Definition

Answer 6

Sets the height and width of an element

Question 7

Display:

Removing Bulletpoints

Code

Answer 7

list-style-type:none

Question 8

Display:

Hover

Definition

Answer 8

Triggered when the mouse hovers over an element

Question 9

Form:

Text

Code

Answer 9

< input type=”text” name=”firstname”>

Question 10

Form:

Number

Code

Answer 10

< input type=”number” name=”rating”>

Question 11

Form:

Textarea

Code

Answer 11

< textarea name=”message” rows=”6” cols=”80”> < /textarea >

Question 12

Form:

Radio

Code

Answer 12

< input type=”radio” name=”traffic-light” value=”red” checked>Red< br>

< input type=”radio” name=”traffic-light” value=”amber”>Amber< br>

< input type=”radio” name=”traffic-light” value=”green”>Green< br>

Question 13

Form:

Select

Code

Answer 13

< select name=”bigcats”>
< option value=”lion”>Lion</option>

< option value="tiger">Tiger</option >

< option value="panther">Panther</option >

< option value="puma">Puma</option >

< /select >

Question 14

Form:

Submit

Code

Answer 14

< input type=”submit” value=”Submit”>

Question 15

Form:

Length Validation

Code

Answer 15

< input type=”text” maxlength=”15” minLength=”1”>

Question 16

Form:

Range Validation

Code

Answer 16

< input type=”number” min=”0” max=”10”>

Question 17

Form:

Presence Check

Code

Answer 17

< input type=”text” required>

Question 18

How is a horizontal navigation bar created?

Definition / Code

Answer 18

• Remove bullet points (nav ul)
• Float left (nav ul li)
• Display block and padding (nav ul li a)
• Change appearance when mouse hovers (nav ul li a:hover)