Beginner CSS Flashcards

1
Q

What does CSS stand for?

A

Cascading Styles Sheets

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

How does CSS differ from HTML?

A

HTML is the meaning or content

CSS is the presentation (style) of that document

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What is the standard format of CSS?

A

property: value

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What are the three ways to apply CSS?

A
  1. ) Inline
  2. ) Internal
  3. ) External
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

______ styles are plonked straight into the HTML tags using the style attribute.

A

Inline styles

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

How to use the color red?

A

color: red

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

True or False? Inline styles should be avoided wherever possible

A

True: HTML should be a stand-alone, presentation free document, and so in-line styles should be avoided wherever possible

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

_______ styles are used for the whole, multiple-page website. There is a separate CSS file.

A

External

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What tag is used to include a CSS file in an HTML document?

A

link along with the attributes rel=”stylesheet” and href=”style.css”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Whereas HTML has tags, CSS has _________

A

Selectors

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What are CSS selectors?

A

Selectors are the names given to styles in internal and external style sheets.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What are HTML selectors?

A

HTML selectors are simply the names of HTML tags and are used to change the style of a specific type of element

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

For each selector there are ________

A

Properties

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

A _______ is given to the property following a colon

A

Value

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

px

A

The unit for pixels: 12px

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

em

A

The unit for the calculated size of a font: 2em is two times the current font size.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

pt

A

The unit for points, for measurements typically in printed media: 12pt

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

%

A

The unit for percentages: 80%

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

pc

A

The unit for picas

20
Q

True or False: When a value is zero, you do not need to state a unit.

A

True: if you wanted to specify no border, it would be border: 0;

21
Q

CSS has 24-bit color which provides how many colors?

A

16,777,216 colors

22
Q

What are the four ways you can specify color in CSS?

A
  1. ) By name
  2. ) RGB (red / green / blue)
  3. ) Hex code
  4. ) HSL (hue, saturation and lightness)
23
Q

The three values in the RGB value are from ______

A

0 to 255
0 being the lowest (no color)
255 being the highest (full color)

24
Q

What is the compressed version of the hex value #ff0000

A

f00

25
Q

What is the difference between the 3 and 6 digit version of a hex number?

A

The 3 digit version is easier to understand (RBG), but the 6 digit version provides more control over the exact color.

26
Q

What two properties can be used to apply color?

A

color and background-color

27
Q

font-family

A

This is the font itself, such as Times New Roman, Arial, or Verdana.

28
Q

_________ sets the size of the font

A

font-size

29
Q

font-weight

A

States whether the text is bold or not

font-weight: bold or font-weight: normal

30
Q

States whether the text is italic or not

A

font-style

font-style: italic or font-style: normal

31
Q

text-decoration

A

States whether the text has got a line running under, over, or through it

text-decoration: underline
text-decoration: overline
text-decoration: line-through

32
Q

_______ will change the case of the text

A

text-transform

text-transform: capitalize
text-transform: uppercase
text-transform: lowercase
text-transform: none

33
Q

True or False

Underlines should only really be used for links?

A

They are a commonly understood web convention that has lead users to generally expect underlined text to be a link.

34
Q

The ______________ properties are for spacing between letters or words.

A

letter-spacing and word-spacing

The value can be a length or normal

35
Q

line-height

A

The line-height property sets the height of the lines in an element, such as a paragraph, without adjusting the size of the font.

36
Q

The _______ property will align the text inside an element to left, right, center, or justify.

A

text-align

37
Q

The _______ property will indent the first line of a paragraph, for example, to a given length or percentage.

A

text-indent

This is a style traditionally used in print, but rarely in digital media such as the web.

38
Q

What are the two most commonly used properties for spacing-out elements?

A

margin and padding

39
Q

Margin?

A

A margin is the space outside something

40
Q

______ is the space inside something

A

padding

41
Q

The four sides of an element can also be set individually with which type of properties?

A

margin-top
margin-right
margin-bottom
margin-left

42
Q

What is The Box Model?

A

Margins, padding and borders are all part of what’s known as The Box Model.

  1. ) The content area
  2. ) Padding box
  3. ) Border box
  4. ) Margin box
43
Q

True or False?

The box model can be applied to every element on the page

A

True

44
Q

To make a border around an element, all you need is __________

A

border-style

45
Q

The values of border

A

solid, dotted, dashed, double, groove, ridge, inset, outset

46
Q

border-width

A

border-width sets the width of the border, most commonly using pixels as a value

47
Q

border-color

A

border-color sets the color