WDD : Implementation (CSS)

Question 1

Inline CSS

Answer 1

This is when the CSS command is inside a specific tag.

Question 2

Internal CSS

Answer 2

This is when the CSS code is saved in the individual web page code.
This CSS can only be accessed by the web page.
Can make the coding FOR THIS PAGE ONLY more efficient.

Question 3

External CSS

Answer 3

This is when the CSS code is saved in a separate file.
This CSS can be accessed by any web page
Can make coding FOR MANY WEB PAGES more effecient.
Makes ensuring conistency FOR MANY PAGES easier.

Question 4

Control appearance and positioning:

display:block

Answer 4

an element uses the entire width of its container

Question 5

Control appearance and positioning:

display:inline

Answer 5

an elemnt uses only as much width as necessary

Question 6

Control appearance and positioning:

Display:none

Answer 6

an elemnt is not visible

Question 7

Control appearance and positioning:

float: left
float: right

Answer 7

Displays the element to the left/right hand side of other elements

Question 8

Control appearance and positioning:

clear:both

Answer 8

States that an element is not allowed to floar on the LEFT or RIGHT side.

Question 9

Control appearance and positioning:

Margin

Answer 9

A transparent area around the outside of an element.

Margins can be declared as :
margin = Margin is declared on all 4 sides
margin-top = Margin is decalred on the top
margin-right = Margin is decalred on the right
margin-bottom = Margin is declared on the bottom
margin-left= Margin is declared on the left

These properties may have the values:
auto (calculated by the browser) is normally used to positiona an element in the middle of the browser’s window or within another element.
length (usually in pixels)

Question 10

Control appearance and positioning:

Padding

Answer 10

A transperent area inside the edge of an element.

Paddings can be declared as:
padding
padding-top
padding-right
padding-bottom
padding-left

These properties may have the value:
length (usually in pixels)

Question 11

Control appearance and positioning:

Width and height

Answer 11

These allow for the size of an element to be defined

Measured as either
Percentage
Pixels
Centimetres

Question 12

Creating Horizontal Navigational Bars

Answer 12

1. Remove bullter points
   nav li {list-style-type:none}
2. Positioning list items horizonataly
   nav ul li {float:left}
3. Spacing out each item
   nav ul li {float:left; width:100px; text-allign:center;}
4. Creating clickable boxes
   nav ul li a {display:block}
5. Add colour to clickable boxes when hover
   nav ul li a:hover {background-color:blue ;color:white}