HTML Flashcards

1
Q

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

A

Inside the head tag holds all of the meta data that is describing the html document.

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

Inside the body tags

Also the tag inside the tags shows up in the browser tab.

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

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

A

Between the html tags.

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

Communicates to the browser about what document type to expect.

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

Give five examples of HTML element tags.

A

”< p >< /p >

< h1 >< /h1 > through < h6 > h6 >< em >< / em>< 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

Attributes provide additional information about an element, and attach further information on the contents of an element.
Ex.

<p>Text Content</p>

“There is an opening tag for the p element with an attribute ‘class’ and its value ‘second paragraph.’

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
HTML entities are to create special characters within html.
Ex. & reg;
® 
®
"There is an html entity reg"
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

Block-level elements take up the full width and height of a line. They do not allow any other element to share a space with them. 100% theirs. The flow is one element per line.

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

Inline elements can share a space with other elements. Therefore, they have more flow and only take up as much space on the line as needed.

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

The full width and height of a line.
Ex.
“<div>Hi, I am in-block and I take up the whole ass line. I’m a bully because I do not share.
</div>”

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

Just the needed width of that element.
Ex.
“<p>I am a <span> element</span> and only take up the width of the word ‘element’ in this paragraph,</p>”

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 is numbered.  <ol></ol>
<h2>Ordered List Example</h2>
      <ol>
        <li>Learn to code.</li>
        <li>Build projects.</li>
        <li>Get a job.</li>
      </ol>

Unordered List <ul></ul>

    <h2>Unordered List Example</h2>
      <ul>
        <li>HTML</li>
        <li>CSS</li>
        <li>JS</li>
        <li>SQL</li>
        <li>PHP</li>
      </ul>"
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. They be taking up the whole line.

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 tag

< a href=””>< /a>href=”https://disneyland.disney.go.com/”>Disneyland

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

What is an absolute URL?

A

An absolute URL links to another website from your document. The href attribute is set to the domain address.

<a>Google</a>

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

What is a relative URL?

A

Relative URL link to other pages within the same site, therefore does not need to have the domain name.
“<a> About </a>”

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

../ signifies going “up a level” into the parent directory

<a></a>

There is a relative URL pointing to the index.html within the parent directory</a>

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

Stating the name of the .html

<a>
There is a relative URL pointing to the index.html
</a>

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

../../index.html
Going up two levels.
<a></a>

There is a relative URL pointing to the index.html within the parent directory within that parent directory
</a>

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

Stating the name of the file name, uncommon syntax would have a “./index.html”

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

Enables users to search forma and other functions online, interactive control and user entering data.

22
Q

Give five examples of form control elements.

A

option. select. password, textarea, input, button,

23
Q

Give three examples of type attributes for HTML elements

A
text=""
password=""
textarea=""
a href =""
class=""
id=""
24
Q

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

A

inline, they can be on the same line

25
Q

What are the six primary HTML elements for creating tables?

A

table - assigns a table
thead- defines the titles for the table columns
tr- defines table row
th - table head defines content defined in thead container
tbody - defines body of the table
td -defines table data for row

ORDER AND STRUCTURE

26
Q

What purpose do the thead and tbody elements serve?

A

thead defines the set of rows defining the head of the columns of the table

tbody encapsulates a set of table rows that comprise of the table body

27
Q

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

A

Student grades, plane schedules

28
Q

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

A

CSS Selector and decloration

29
Q

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

A

“.h2 {

}”

30
Q

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

A

Simply state the element
head {
}

31
Q

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

A
#body {
}
32
Q

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

A

Hex codes #ee3e80
Color names color: DarkCyan
rgb(123, 432, 432)

33
Q

What CSS properties make up the box model?

A

padding
margin
border

34
Q

Which CSS property pushes boxes away from each other?

A

margin is outside of the border, therefore creates space between each element’s box

35
Q

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

A

padding is inside of the border

36
Q

What is a pseudo-class?

A

allows user to change the appearance of the elements when a user is interacting with. A special state of the selected elements

37
Q

What are CSS pseudo-classes useful for?

A

User interaction, makes the internet feel more real, helps focus in on where the user is on the page and their current activity

38
Q

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

A

FONT-FAMILY
The value of this property is the
name of the typeface you want
to use.

body {
font-family: Georgia, Times, serif;}

39
Q

Name at least two units of type size in CSS.

A

Pixel, percentages and ems…use pixels

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

divs are block elements and take up a full row, therefore with 2 blocks they will share no space and stack on top of each other

43
Q

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

A

row

44
Q

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

A

relative positioning - the elements affect the surrounding elements around them

45
Q

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

A

it is in the flow, it affects the elements around them

46
Q

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

A

it will be inserted where it is placed

47
Q

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

A

it does not affect the flow of a document

48
Q

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

A

it does not affect flow of a document and can be placed anywhere using offset properties

49
Q

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

A

you place position: relative within its parent container to fix absolute into place

50
Q

What are the four box offset properties?

A

top left right bottom