HTML & CSS Flashcards

1
Q

Where do you put non-visible content about the HTML document?

A

In the head element

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

Where do you put visible content about the HTML document?

A

In the Body element

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

Where do the and tags go in a valid HTML document?

A

Inside the element

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

What is the purpose of a declaration?

A

to tell the browser what version of HTML you are using

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

Give five examples of HTML element types.

A

head, body, ol, ul, div, p, img

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

What is the purpose of HTML attributes?

A

provide additional information about the contents of an element

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

Give an example of an HTML entity (escape character).

A

copywrite: © or ©

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

How do block-level elements affect the document flow?

A

They separate items inside them from other elements on the page into their own lines

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

How do inline elements affect the document flow?

A

they can be used to assign an element to something sharing space(or lines) with other code or text

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

What are the default width and height of a block-level element?

A

100 by default

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

What are the default width and height of an inline element?

A

Only as much room as the enclosed content needs

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

What is the difference between an ordered list and an unordered list in HTML?

A

ordered list uses numbers and unordered list uses dots(by default)

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

Is an HTML list a block element or an inline element?

A

block

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

What HTML tag is used to link to another website?

A

anchor element or a

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

What is an absolute URL

A

A link to a location outside of your server or website

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

What is a relative URL?

A

a link to another location within your own website

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

How do you indicate the relative link to a parent directory?

A

../filename

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

How do you indicate the relative link to a child directory?

A

name of the directory with a forward slash(/) then the file name (directory/filename)

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

How do you indicate the relative link to a grand parent directory?

A

repeat the dot dot slash method (../../)

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

How do you indicate the relative link to the same directory?

A

just the filename

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

What is the purpose of an HTML form element?

A

to be a boundary for form control elements

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

Give five examples of form control elements.

A

option, textarea, input, select, button

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

Give three examples of type attribute values for HTML elements

A

checkbox, text, radio, submit

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

Is an HTML element a block element or an inline element?

A

inline

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

What are the six primary HTML elements for creating tables?

A

table, thead, tbody, tr, td,th

26
Q

What purpose do the thead and tbody elements serve?

A

is for describing the content in

27
Q

Give two examples of data that would lend itself well to being displayed in a table.

A

populations of cities

student grades

28
Q

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

A

selector, rule block, property, value

29
Q

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

A

use a period with the classname (.classname)

30
Q

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

A

using element names and commas

31
Q

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

A

pound sign and classname (#classname)

32
Q

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

A

HSL functional, hex code, RGB functional, color name

33
Q

What CSS properties make up the box model?

A

margin, padding, border

34
Q

Which CSS property pushes boxes away from each other?

A

margin

35
Q

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

A

padding

36
Q

What is a pseudo-class?

A

a class used to apply style to elements under particular conditions

37
Q

What are CSS pseudo-classes useful for?

A

simplifying the assignment of styling for larger scale projects

38
Q

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

A

rem and px

39
Q

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

A

font-family

40
Q

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

A

row

41
Q

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

A

no-wrap

42
Q

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

A

because theyre block elements

43
Q

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

A

row

44
Q

what is the purpose of the container class?

A

It sets up a makeshift block to be controlled

45
Q

what is the purpose of the row class?

A

to set up a vertical chunk to be manipulated

46
Q

what is the purpose of the column class?

A

to set up a vertical chunk to be manipulated

47
Q

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

A

position: static;

48
Q

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

A

the document flow remains the same, only the selected element will move

49
Q

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

A

it changes where it sits on the page relative to its original position from the normal flow of the page elements.

50
Q

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

A

it removed the effected element and causes the rest of the elements to shift upward as though the absolute element isn’t there

51
Q

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

A

its boundry will be the closest non-static parent

52
Q

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

A

add the CSS property for position: relative;

53
Q

What are the four box offset properties?

A

top, bottom, left, right

54
Q

What does the transform property do?

A

modifies the coordinate space of the CSS visual formatting model

55
Q

Give four examples of CSS transform functions.

A

rotate, skew, scale, translate

56
Q

The transition property is shorthand for which four CSS properties?

A

property, duration, timing-function, delay

57
Q

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

A

min-height, mid-width, max-width

58
Q

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

A
59
Q

What is a breakpoint in responsive Web design?

A
60
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

so that it will adjust accordingly to changing screen size not only between screen sizes but also viewport sizes on desktop windows

61
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