HTML & CSS

Question 1

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

Answer 1

In the head element

Question 2

Where do you put visible content about the HTML document?

Answer 2

In the Body element

Question 3

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

Answer 3

Inside the element

Question 4

What is the purpose of a declaration?

Answer 4

to tell the browser what version of HTML you are using

Question 5

Give five examples of HTML element types.

Answer 5

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

Question 6

What is the purpose of HTML attributes?

Answer 6

provide additional information about the contents of an element

Question 7

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

Answer 7

copywrite: © or ©

Question 8

How do block-level elements affect the document flow?

Answer 8

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

Question 9

How do inline elements affect the document flow?

Answer 9

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

Question 10

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

Answer 10

100 by default

Question 11

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

Answer 11

Only as much room as the enclosed content needs

Question 12

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

Answer 12

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

Question 13

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

Answer 13

block

Question 14

What HTML tag is used to link to another website?

Answer 14

anchor element or a

Question 15

What is an absolute URL

Answer 15

A link to a location outside of your server or website

Question 16

What is a relative URL?

Answer 16

a link to another location within your own website

Question 17

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

Answer 17

../filename

Question 18

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

Answer 18

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

Question 19

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

Answer 19

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

Question 20

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

Answer 20

just the filename

Question 21

What is the purpose of an HTML form element?

Answer 21

to be a boundary for form control elements

Question 22

Give five examples of form control elements.

Answer 22

option, textarea, input, select, button

Question 23

Give three examples of type attribute values for HTML elements

Answer 23

checkbox, text, radio, submit

Question 24

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

Answer 24

inline

Question 25

What are the six primary HTML elements for creating tables?

Answer 25

table, thead, tbody, tr, td,th

Question 26

What purpose do the thead and tbody elements serve?

Answer 26

is for describing the content in

Question 27

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

Answer 27

populations of cities | student grades

Question 28

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

Answer 28

selector, rule block, property, value

Question 29

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

Answer 29

use a period with the classname (.classname)

Question 30

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

Answer 30

using element names and commas

Question 31

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

Answer 31

pound sign and classname (#classname)

Question 32

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

Answer 32

HSL functional, hex code, RGB functional, color name

Question 33

What CSS properties make up the box model?

Answer 33

margin, padding, border

Question 34

Which CSS property pushes boxes away from each other?

Answer 34

margin

Question 35

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

Answer 35

padding

Question 36

What is a pseudo-class?

Answer 36

a class used to apply style to elements under particular conditions

Question 37

What are CSS pseudo-classes useful for?

Answer 37

simplifying the assignment of styling for larger scale projects

Question 38

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

Answer 38

rem and px

Question 39

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

Answer 39

font-family

Question 40

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

Answer 40

row

Question 41

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

Answer 41

no-wrap

Question 42

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

Answer 42

because theyre block elements

Question 43

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

Answer 43

row

Question 44

what is the purpose of the `container` class?

Answer 44

It sets up a makeshift block to be controlled

Question 45

what is the purpose of the `row` class?

Answer 45

to set up a vertical chunk to be manipulated

Question 46

what is the purpose of the `column` class?

Answer 46

to set up a vertical chunk to be manipulated

Question 47

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

Answer 47

position: static;

Question 48

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

Answer 48

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

Question 49

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

Answer 49

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

Question 50

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

Answer 50

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

Question 51

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

Answer 51

its boundry will be the closest non-static parent

Question 52

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

Answer 52

add the CSS property for position: relative;

Question 53

What are the four box offset properties?

Answer 53

top, bottom, left, right

Question 54

What does the transform property do?

Answer 54

modifies the coordinate space of the CSS visual formatting model

Question 55

Give four examples of CSS transform functions.

Answer 55

rotate, skew, scale, translate

Question 56

The transition property is shorthand for which four CSS properties?

Answer 56

property, duration, timing-function, delay

Question 57

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

Answer 57

min-height, mid-width, max-width

Question 58

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

Question 59

What is a breakpoint in responsive Web design?

Question 60

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?

Answer 60

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

Question 61

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?