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

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

A

Rule Set
selector { property : value }
declaration = property : value

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

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

A

.class-name

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

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

A

use the element-name

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

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

A

id-name

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

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

A

RGB Values
Hex Codes
Color Names

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

What CSS Properties make up the box model?

A

Margin, border, padding

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
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
8
Q

Which CSS property add 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
9
Q

What is a pseudo-class?

A

Class that specifies a special state of the selected element

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

It lets you style elements in a different way when the user is interacting with them

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

Name at least two units of type size in CSS.

A

Pixel, percentages, rem, ems

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

They are block 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

19
Q

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

A

The positioning is relative to where it would have been in the normal flow.

20
Q

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

A

Other elements will be shifted into its place because it is taken out of the normal flow.

21
Q

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

A

The element is positioned within the first ancestor element that is not static (usually relative).
You should only used absolute positioning when you want to layer elements.

22
Q

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

A

The containing block should have a non-static position.

23
Q

What are the four box offset properties?

A

Top, bottom, left, right

24
Q

What are the four components of “the Cascade”.

A

Inheritance
Specificity
Source Order
!important

25
Q

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

A

The styling lower on the page will take precedent over those above it, given that specificity is the same.

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 of properties that can be inherited.

27
Q

List the three selector types in order of increasing specificity.

A

Element > Class > ID

28
Q

Why is using !important considered bad practice?

A

It makes it difficult to debug because it breaks the normal cascading.

29
Q

What does the transform property do?

A

Lets you rotate, scale, skew, or translate an element

Modifies the coordinate space

30
Q

give four examples of CSS transform functions

A

Translate
Scale
Rotate
Skew

31
Q

The transition property is shorthand for which four CSS properties?

A

Property Name
Duration
Easing Function
Delay

32
Q

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

A

max and min width

33
Q

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

A

Viewport

34
Q

What is a breakpoint in responsive Web design?

A

Break points are the points where you use media queries. (generally widths where you want the page to change layout)

35
Q

What is the advantage of using percentage width instead of a fixed width for a “column” class in a responsive layout?

A

It makes the column classes more responsive, so it can grow or shrink depending on the size of the parent.

36
Q

If you introduce CSS for a smaller min-sidth 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

Source Order

Web Development (4 decks)

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