HTML Elements

Question 1

!

Answer 1

Pick the first option that shows up, it will prefill default HTML code

Question 2

To write the copyright signal

Answer 2

&copy

& + copy

Question 3

Need to tell it’s HTML

Answer 3

< !DOCTYPE html >

Question 4

You always need this as first element

Answer 4

< head >

Question 5

Title of the page, shows in browser tab

Answer 5

< title >

Question 6

Here you can drop the CSS styling if you want it on the same page

Answer 6

< style >

Question 7

Used for referring link to stylesheet.

Answer 7

< link >

Not the same as < a > element !!< /a >

Question 8

All visible elements

Answer 8

< body >

Question 9

Primary heading

Answer 9

< h1>

Each page should have only 1 h1 heading
< / h1 >

Question 10

Heading: Marks importance, does not say anything about font size per se

Answer 10

< h2 > / < /h2 >< h6 >< /h6 >

Question 11

Use instead of < b >< /b >

Answer 11

< strong >

Don’t use < b > but use <strong> instead to make text bold. It marks importance
< /strong >< /b >< /strong ></strong>

Question 12

Use instead of < i >< /i >

Answer 12

< em >

Use <em> instead of < i > for italic text
< /i >< /em >< /em ></em>

Question 13

Paragraph.

Answer 13

< p >

Paragraph. By closing the < /p > element there will be a space automatically

Question 14

Image element

Answer 14

< img >

Question 15

When wanting to create a container element

Answer 15

< div > < /div >

Question 16

Ordered list - The entries will be numbered automatically

Answer 16

< ol >< /ol >

Question 17

List element

Answer 17

< li >

Question 18

Unordered list

Answer 18

< ul >< /ul >

Question 19

Anchor element for hyperlink

Answer 19

< a >

Inherits the styling from its parent!< /a >

Question 20

Not a visible element but good way of structuring the website when you have a links section for example

Answer 20

< nav >

Question 21

Can be anything, like a blog for example

Answer 21

< article >

Question 22

< aside >

Used when?

Answer 22

Used when wanting to write text aside images. The can then be the container for both

Question 23

< footer >

Used for?

Answer 23

Semantic element only

Question 24

< id >

What does it do?

Answer 24

Gives the element an id which can be used in the CSS

Question 25

Block-level element

Answer 25

Occupy 100% of parent element’s width no matter the content, they are stacked vertically, box models applies

Question 26

Block-level elements types?

Answer 26

body, main, header, footer, section, nav, aside, div, h1-h6, p, ul, ol, li, etc

Question 27

Block-level override

Answer 27

Override with display:block

Question 28

Inline element - What is it?

Answer 28

Occupies only space necessary for its content, causes no line-breaks, box model height and width don’t apply, paddings and margins only apply horizontally

Question 29

Inline element examples

Answer 29

a, img, strong, em, button, etc

Question 30

Inline element override

Answer 30

Override with display:inline

Question 31

Inline-block what is it?

Answer 31

Occupies only content’s space, causes no line-breaks, box-model applies as showed

When set to inline block suddenly there’s a margin on the top and bottom because it behaves partly like a block element now

Images behave as inline-block elements as well. When setting the margin it will be all around the element while in fact still is an inline element

Question 32

Inline block - How does is differ?

Answer 32

When set to inline block suddenly there’s a margin on the top and bottom because it behaves partly like a block element now

Question 33

What type of element is image?

Answer 33

Images behave as inline-block elements as well. When setting the margin it will be all around the element while in fact still is an inline element