Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

Web Development > CSS > Flashcards

CSS Flashcards

1
Q

Name three different types of values you can use to specify colors in CSS.

A

RGB, Hexidecimal, Color name

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

What 5 CSS properties make up the box model?

A

Margin, Padding, Width, Height, Border

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

Which CSS property pushes boxes away from each other?

A

margin

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

Which CSS property adds space between a box’s content and its border?

A

Padding

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

What are the names of the individual pieces of a CSS rule?

A

Selector and a declaration

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

In CSS, how do you select elements by their class attribute?

A

by using a period ( . )

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

In CSS, how do you select elements by their type?

A

By typing the matching element name.

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

In CSS, how do you select an element by its id attribute?

A

By using a ( # ) symbol.

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

What is a pseudo-class?

A

a keyword added to a selector that specifies a special state of the selected element(s).

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

What are CSS pseudo-classes useful for?

A

pseudo-classes allow us to apply styling based on user interaction or the structure of the HTML document

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

Name two types of units that can be used to adjust font-size in CSS.

A

pixels, rem

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

What CSS property controls the font used for the text inside an element?

A

font-family

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

What is the default flex-direction of a flex container?

A

Row

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

What is the default flex-wrap of a flex container?

A

No wrap

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

Why do two div elements “vertically stack” on one another by default?

A

Because they are block-level elements

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

What is the default flex-direction of an element with display: flex?

A

Row

17
Q

What is the default value for the position property of HTML elements?

A

static

18
Q

How does setting position: relative on an element affect document flow?

A

it doesn’t affect the document flow

19
Q

How does setting position: relative on an element affect where it appears on the page?

A

it sits right where it’s supposed to be. Like normal flow

20
Q

How does setting position: absolute on an element affect document flow?

A

it is no longer a part of normal document flow

21
Q

How does setting position: absolute on an element affect where it appears on the page?

A

it will appear at the top left corner of the nearest ancestor element that is not static

22
Q

How do you constrain an absolutely positioned element to a containing block?

A

set position: not static;

23
Q

What are the four box offset properties?

A

top, right, bottom, left

24
Q

What does the term “source order” mean with respect to CSS?

A

the order that your CSS rules are written in your stylesheet.

25
Q

List the three selector types in order of increasing specificity.

A

type, class, id

26
Q

How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?

A

inheritance

27
Q

Why is using !important considered bad practice?

A

it overrides everything / subverts the cascade

28
Q

What are the four components of “the Cascade”.

A

source order, inheritance, specificity, !important

29
Q

What does the transform property do?

A

The transform CSS property lets you rotate, scale, skew, or translate an element.

30
Q

Give four examples of CSS transform functions.

A

translate, scale, rotate, skew

31
Q

Give two examples of media features that you can query in an @media rule.

A

min width, max width

32
Q

Which HTML meta tag is used in mobile-responsive web pages?

A

meta viewport

33
Q

What is a breakpoint in responsive Web design?

A

CSS breakpoints are points where the website content responds according to the device width

34
Q

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?

A

Fixed values may not look the way you want them to in different circumstances

35
Q

If you introduce CSS rules for a smaller min-width after the styles for a larger min-width in your style sheet, the CSS rules for the smaller min-width will “win”. Why is that?

A

Because of the CSS cascade

36
Q

Which HTML meta tag is used in mobile-responsive web pages?

A

meta viewport

37
Q

What is a breakpoint in responsive Web design?

A

the point at which the page changes / responds to expanding / contracting

38
Q

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?

A

pixels are fixed, percentages are relative

39
Q

If you introduce CSS rules for a smaller min-width after the styles for a larger min-width in your style sheet, the CSS rules for the smaller min-width will “win”. Why is that?

A

because of the cascade / source order

Web Development (4 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions