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

CSS rule consist of a selector and a declaration block

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

With .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

You write the name of the element as the selector

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

With #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

Border, margin, 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

A pseudo-class is keywords that are added to a selector that specifies a special state of the selected elements

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

They are useful in applying style to an element without having to additional classes

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

pixels, percentage, 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 - horizontal

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

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

A

Static - Normal Flow

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

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

A

You can shift element without affecting surrounding text and document flow

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

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

A

It stays where it is unless you shift it

18
Q

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

A

t’s removed from the document flow

19
Q

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

A

Find the boundary and look for a non-static position. Appears nearest non-static parent

20
Q

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

A

Set up non-static position

21
Q

What are the four box offset properties?

A

Top, bottom, left, right

22
Q

What are the four components of “the Cascade”.

A

Source order, inheritance, specificity, !important

23
Q

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

A

Styling provided for an element last in your stylesheet gets priority

24
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

Through inheritance if no CSS for that property is directly declared on the child element.

25
Q

List the three selector types in order of increasing specificity.

A

type, class, id

26
Q

Why is using !important considered bad practice?

A

It makes debugging more difficult by breaking the natural cascading in your stylesheets

27
Q

The transition property is shorthand for which four CSS properties?

A

shorthand property for transition-property, transition-duration, transition-timing-function, and transition-delay

28
Q

What event is fired when a user places their cursor in a form control?

A

focus

29
Q

What event is fired when a user’s cursor leaves a form control?

A

blur

30
Q

what event is fired as a user changes the value of a form control?

A

input

31
Q

What event is fired when a user clicks the “submit” button within a ?

A

submit

32
Q

What does the event.preventDefault() method do?

A

prevents default actions

33
Q

What does submitting a form without event.preventDefault() do?

A

Automatically load the form values

34
Q

What property of a form element object contains all of the form’s control?

A

elements property

35
Q

What property of form a control object gets and sets its value?

A

value property

36
Q

What is one risk of writing a lot of code without checking to see if it works so far?

A

It’s hard to know where the error is

37
Q

What is an advantage of having your console open when writing a JavaScript program?

A

A

38
Q

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

A

max-width, min-width, height, grid, orientation, etc

39
Q

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

A

viewport

40
Q

What is a breakpoint in responsive Web design?

A

point where our styling can break or styling changes and where the media query is introduced

41
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

with percentages the layout adapts to the exact dimensions of the viewport’s width.

42
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

the cascade system.

Web Development (16 decks)

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