Introduction to HTML Flashcards

1
Q

HTML

A

HyperText Markup Language
A language to tell the computer how to structure a website and its content

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

Opening tag

A

Starts an element
Ex: <p>

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

Closing tag

A

Ends and element
Ex:</p>

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

Element

A

Is what structures the webpage and defines its content

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

Element Structure

A

Opening tag: <p>
Content: “Hello World!” (Content may contain other things depending on the tag used)
Closing tag: </p>

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

The Body

<body></body>

A

Only content inside the opening and closing body tags will be displayed

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

Code Structure

A

Elements inside of another element is called the child of the element it is inside. The element that contains the element inside of it is considered the parent. An element on the same level of another element is considered the sibling. It can keep going on to grandchildren, great grandchildren, and so forth.

Ex:

<body>
<h1>Conversations</h1>
<p>Hello</p>
<p>Yo what's up</p>
</body>

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

Paragraph Tag

<p></p>

A

Used in HTML coding for paragraphs, blocks of text, or just sentences if you wanted. Text, or the content, in between the element is what will be shown.

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

Heading Tag

A

<h1> — used for main headings. All other smaller headings are used for subheadings.
<h2>
<h3>
<h4>
<h5>
<h6>
There are only 6, h1 being the largest and getting smaller as the numbers get bigger
</h6></h5></h4></h3></h2></h1>

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

Division Tag

<div></div>

A

Used for grouping elements in the HTML file together. It could be used so that the code is read easier, but it can also be used to add styling, most common to use CSS but can also be done in the same file

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

Attributes

A

Content that is added to opening tags. Attributes are made up of the following two parts:
The name of the attribute
The value of the attribute

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

id attribute
id=”–”

A

Used for many things such as metadata, or to add styling to what has been id’d

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

Metadata

A

Metadata means “data about data”. Metadata is defined as the data providing information about one or more aspects of the data; it is used to summarize basic information about data that can make tracking and working with specific data easier.

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

Span Tag
<span></span>

A

Like the div tag but used to separate content on the same line instead of groups of elements. There may be no visual difference when seen on the website because one must add styling using CSS.

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

<em></em>

A

Generally renders as italic emphasis

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

<strong></strong>

A

Generally rendered as bold emphasis

16
Q

Line Break Element
<br></br> or <br></br>

A

If one wants to modify the spacing in the browser, they add the line break element. Multiple line breaks next to each other will be how many times the text after that will move down

17
Q

Unordered Lists

<ul></ul>

A

Outlines individual list items with a bullet point. Individual list items must be added to the unordered list using the <li> tag.

18
Q

Individual List

<li></li>

A

The <li> or list item tag is used to describe an item in a list. It is for unordered and ordered lists.

19
Q

Ordered Lists

<ol></ol>

A

Like unordered lists, except that each list item is numbered. Individual list items must be added to the ordered list using the <li> tag.

20
Q

Self Closing Tags

A

Tags that don’t have an opening AND closing tag. They are like opening and closing tags combined and have the slash at the end of the tag. These tags are for tags that don’t have any content within them.
Ex: <img></img> or <br></br>

21
Q

Image Tag
<img></img> or <img></img>

A

Used for inputting images on the webpage. The <img></img> tag has a required attribute called src or source.

22
Q

Source Attribute
src=”–”

A

Used for the <img></img> tag and must contain the URL of the image for it to be shown on the webpage.

23
Q

Alt Attribute

A

Alt means alternative text. It brings meaning to the images on our sites. The alt attribute can be added to the image tag just like the src attribute. The value of alt should be a description of the image.

24
Q

Video Tag

<video></video>

A

Inputs videos on the webpage. The <video> tag requires a src attribute with a link to the video source. After the src attribute, the width and height attributes are used to set the size of the video displayed in the browser. The controls attribute instructs the browser to include basic video controls such as pausing and playing. The reason why it is not a self closing tag like the <img></img> tag is because you're supposed to add the text, "Video not supported", which will only be displayed if the browser is unable to load the video. It will be between the opening and closing video tags, making it not a self closing tag.</video>