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

selector; declaration with a property and 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

.classname

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

match 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

idname

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

Three different types of values used to specify colors in CSS

A

RBG 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

border, margin, padding, height, width

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 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
9
Q

What is a pseudo class?

A

a class applied by a browser 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 pseudo classes useful for?

A

applying style to an element in relation to external factors or events made by the user

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

Two types of units that can be used to adjust font-size in CSS

A

px, 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 (left to right)

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

nowrap (all flex items are on one line)

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

div elements 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 (left to right)

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 stays the same

19
Q

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

A

it stays the same

20
Q

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

A

it gets removed from the document flow

21
Q

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

A

it gets positioned against non-static elements

22
Q

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

A

set property as not static

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
  1. source order
  2. inheritance
  3. specificity
  4. !important
25
Q

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

A

styling towards the bottom is stronger and therefore gets applied

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

inherited properties by default are set to the value of the parent element

27
Q

List the three selector types in order of increasing specificity

A
  1. type selectors
  2. class selectors
  3. ID selectors
28
Q

Why is using !important considered bad practice?

A

it will make debugging more difficult by breaking natural cascade in stylesheet

29
Q

What does the transform property do?

A

lets you rotate, scale, skew, or translate an element by modifying the coordinate space

30
Q

Give four examples of CSS transform functions.

A
  1. matrix
  2. scale
  3. rotate
  4. skew
31
Q

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

A
  1. min-width

2. max-width

32
Q

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

A

viewport

33
Q

The transition property is shorthand for which four CSS properties?

A

transition-property
transition-duration
transition-timing-function
transition-delay

34
Q

What is a breakpoint in responsive Web design?

A

the point at which you want to use media query to change design to cater to dimensions of different devices

35
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

more accurate because % is used to define size as relative to element’s parent object

36
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
  • specificity; CSS source order still applies

- avoid this by putting min-width in ascending order

Web Development (3 decks)

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