Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

Front End Web Development > HTML 5 > Flashcards

HTML 5 Flashcards

1
Q

What is a text editor?

A

A text editor is a program that allows us to write code.

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

What does HTML stand for?

A

Hypertext Markup Language

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

What are the rules that every html file must follow (tags)?

A

<!DOCTYPE html>

<html>
<head>
<title></title>
</head>
<body>
</body>

</html>

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

What is the shortcut (in sublime) for quickly creating the default tags for html page?

A

Type html and hit the tab key.

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

<!DOCTYPE html>

A

All HTML documents must start with a <!DOCTYPE> declaration.The declaration is not an HTML tag. It is an “information” to the browser about what document type to expect.

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

What is the difference between a tag and an element?

A

HTML element is the collection of start tag, its attributes, an end tag and everything in between. An HTML tag (either opening or closing) is used to mark the start or end of an element

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

<b></b>

A

<b> tag is used to highlight in bold that part of the text, which we want to make more obvious for the user.</b>

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

<p>
</p>

A

This element creates a paragraph in html file.

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

<h1>
</h1>

A

This element creates a header in html file.

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

<strong></strong>

A

The strong element will bold a text. The <b> element was used in the past.</b>

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

<em></em>

A

The emphasis element will italicize text.

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

<ol>
</ol>

A

The <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical.

Ex:

<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>

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

<ul>
</ul>

A

The <ul> tag defines an unordered (bulleted) list.

Ex:

<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>

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

What does the value attribute inside of an <li> element do?

A

The value attributes sets the numeric or alphabetic starting value of the items in an ordered list.

The value can be numeric, alphabetic, roman numerals, etc.

<ol>
<li>Paper</li>
<li>Pencils</li>
<li>Scissors</li>
<li>Erasers</li>
</ol>

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

<li>
</li>

A

The <li> HTML element is used to represent an item in a list. It must be contained in a parent element: an ordered list ( <ol> ), an unordered list ( <ul> ), or a menu ( <menu> ).

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

What are nested list?

A

Nested list are list inside of list.

Ex:

<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>

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

What are self closing tags?

A

A self-closing tag in HTML is a kind of HTML tag that does not need to be closed manually by its closing tag, which means it does not have a separate closing tag as </tag>

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

<br></br>

A

The <br></br> tag inserts a single line break. (There is no closing tag)

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

<hr></hr>

A

The <hr> HTML element represents a thematic break between paragraph-level elements: for example, a change of scene in a story, or a shift of topic within a section.

The <hr> element is most often displayed as a horizontal rule that is used to separate content (or define a change) in an HTML page.

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

<img></img>

A

The <img></img> tag is used to embed an image in an HTML page.
Images are not technically inserted into a web page; images are linked to web pages. The <img></img> tag creates a holding space for the referenced image.

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

What are the two required attributes for an <img></img> tag?

A
  1. src - Specifies the path to the image
  2. alt - Specifies an alternate text for the image, if the image for some reason cannot be displayed
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

What do attributes require?

A

Attributes require a name and a value.

Ex: <p lang= "en-us">Paragraph in English</p>

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

What are attributes?

A

An attribute in HTML provides additional information about an HTML element. It comes in a name and value pair with the structure name=”value”. For example, you can specify the width of an HTML element with the attribute width=”500”.

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

<a></a>

A

The anchor tag, used to specify the text that is the “anchor” for a link.

Ex:
<a>Learn to code!</a>

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

<button></button>

A

This is a button tag.

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

What is hypertext?

A

Hypertext is text that is linked to other text.

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

What does href stand for?

A

hyperlink reference

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

What is the href attribute?

A

Links are created in HTML with the href attribute.The href attribute allows us to specify the URL, or address on the web, that a link should take users to.

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

What are relative paths?

A

Relative paths are links to another page on the same website, so we can omit the first part.

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

Explain separation of concerns

A

separation of concerns is a design principle for separating a computer program into distinct sections such that each section addresses a separate concern.

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

What is the html link tag for?

A

An HTML link tag is often used to create a connection between an HTML file and the CSS file and tells the browser to apply the CSS styles to the HTML.

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

rel attribute

A

rel attribute specifies the relationship between the current document and the linked resource.

Ex:

<link></link>

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

What is an event?

A

An event is something that can happen in a browser, like clicking or hovering with your mouse.

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

How can attributes set events?

A

HTML attributes can set events, where the name of the attribute is the event and the value of the attribute is the JavaScript function that we want to execute.
Ex:
<button>Repaint</button>

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

What does SQL stand for?

A

SQL stands for structured query language.

36
Q

What is the function of SQL?

A

SQL stores information in tables, which is simply a collection of information organized into rows and columns. I

37
Q

What is programming?

A

programming is giving a set of instructions to a computer to execute.

38
Q

What is the difference between programming and coding?

A

Programming is the mental process of thinking up instructions to give to a machine (like a computer) and coding is the process of transforming those ideas into a written language that a computer can understand.

39
Q

HTML is a declarative language. How are declarative languages different than non-declarative languages?

A

Declarative languages tell an interpreter what to do, not how to do it.

40
Q

What is the main goal of html?

A

The main goal of html is to structure a page.

41
Q

What should we be asking ourselves when we are developing a website?

A

What are the important pieces of content? What is the information hierarchy going to look like? A good way to approach this is to look at our heading hierarchy.

42
Q

What is accessibility?

A

Accessibility is the practice of making your website useable to as many people as possible.

43
Q

What is semantic html?

A

Semantic html uses tags which best convey the underlining meaning of the content the tag contains.

44
Q

What are the advantages of coherent structure?

A
  1. Readability
  2. Accessibility
  3. Ease of styling
45
Q

What phrases should we avoid when adding alt attributes to our elements?

A

Our text should be descriptive but concise. Avoid phrases like “photo of” or “image of” because this information is redundant.

46
Q

What is divitis?

A

The excessive misuse of divs to markup a page.

47
Q

<html>
</html>

A

The <html> element will contain all of your HTML code.

48
Q

<title>
</title>

A

You can add a title to your web page by using the <title> element, inside of the head.</title>

49
Q

<!-- comment -->

.

A

Adds comments to html document

50
Q

What does the head element contain?

A

The head element contains metadata (data about data) that describes the document.

51
Q

What is the only valid direct child to an <ol> or <ul> element?

A

The <li> element.

52
Q

A

The element is used to contain characters that should be superscript such as the suffices of dates or mathematical concepts like 2^2.

Ex:

<p>On the 4th of September you will learn about E = MC2.</p>

53
Q

A

The element is used to contain characters that should be subscript. It is commonly used with foot notes or chemical formulas such as H2O.

Ex:

<p>The amount of CO2 in the atmosphere grew by 2ppm in 2009.</p>

54
Q

What is a table?

A

A table represents information in a grid format.
Ex: Financial reports, T.V. schedules, and sports results.

55
Q

<table>
</table>

A

The table element is used to create a table. The contents of the table are written out row by row.

56
Q

<tr>
</tr>

A

tr stands for table row. The tr element is used to indicate the start of each row.

57
Q

<td>
</td>

A

td stands for table data. Each cell of a table is represented using a <td> element.

58
Q

<th>
</th>

A

The <th> element is used just like the <td> element but its purpose is to represent the heading for either a column or a row. (th stands for table heading).

59
Q

How can we use the scope attribute in a table?

A

The scope attribute can be used on the <th> element to indicate whether it is a heading for a column or row.

Ex:

<th>Saturday</th>

<th>Tickets sold:</th>

60
Q

colspan attribute

A

Table data can span columns using the colspan attribute.

61
Q

rowspan attribute

A

Table data can span rows using the rowspan attribute.

62
Q

What three sections can a table be split into?

A

a head, a body, and a footer.

63
Q

<thead>
</thead>

A

A table’s head is created with the <thead> element.

64
Q

<tbody>
</tbody>

A

A table’s body is created with the <tbody> element.

65
Q

<tfoot>
</tfoot>

A

A table’s footer is created with the <tfoot> element.

66
Q

What are tags also called?

A

Markup

67
Q

What is structural markup?

A

The elements that you can use to describe both headings and paragraphs.

68
Q

<section> </section>

A

The <section> HTML element represents a generic standalone section of a document, which doesn’t have a more specific semantic element to represent it. These sections should be made up of related content, like contact information. Sections should always have a heading, with very few exceptions.

69
Q

<article></article>

A

The <article> element acts as a container for any section of a page that could stand alone and potentially be syndicated (independently distributable or reusable).

Examples: Individual article or blog entry, a comment or forum post, or any other independent piece of content.

70
Q

What should you do with a page that has several articles (or even summaries of articles)?

A

If a page contains several articles, then each individual article would live inside its own article element.

71
Q

What are some examples of nested articles?

A

A blog post might live inside one <article> element and each comment on the article could live inside its own child <article> element.

72
Q

<aside></aside>

(inside an article)

A

When the <aside> element is used inside an <article> element, it should contain information that is related to the article but not essential to its overall meaning.

Ex: A pullquote or glossary might be considered as an aside to the article it relates to.

73
Q

<aside></aside>

(outside an article)

A

When the <aside> element is used outside of an article element, it acts as a container for content that is related to the entire page. For example, it might contain links to other sections of the site, a list of recent posts, a search box, or recent tweets by the author.

74
Q

<figure></figure>

A

Contains all types of media (images, videos, graphs, diagrams, code samples, text that supports the main body of an article). The figure element should also contain a <figcaption> element which provides a text description for the content of the <figure> element.</figure>

75
Q

<audio></audio>

A

The <audio> HTML element is used to embed sound content in documents. It may contain one or more audio sources, represented using the src attribute or the <source></source> element: the browser will choose the most suitable one.</audio>

76
Q

<main></main>

A

The <main> HTML element represents the dominant content of the <body> of a document. The main content area consists of content that is directly related to or expands upon the central topic of a document, or the central functionality of an application.

77
Q

What is an empty element?

A

An element with no closing tag

78
Q

<form> </form>

A

The <form> HTML element represents a document section containing interactive controls for submitting information.

79
Q

<input></input>

A

The <input></input> HTML element is used to create interactive controls for web-based forms in order to accept data from the user. Input is a self closing tag.

80
Q

How do I create a input form that allows users to enter a text?

A

We create a form element and within our form element we add an input element and set the type to text.

Ex:

<form>
<input></input>
</form>

81
Q

How do you create a form for a user’s email?

A

We create a form element and within that element we add the input element. We set the type to email and include the value required to make adding an email required to continue.

Ex:

<form>
<input></input>
</form>

82
Q

How do you create a form for a user’s birthday?

A

We create a form element and within that element we add the input element. We set the type to date.

Ex:

<form>
<input></input>
</form>

83
Q

How do we create a reset button?

A

We create a form element and within that element we add the input element and set the type to reset.

Ex:

<form>
<input></input>
</form>

84
Q

How do we create radio buttons?

A

We create a form element and within that element we add the input element and set the type to radio. If we have multiple buttons, we need to use the name attribute. (each button should have the same name)

Ex:

<form>
Gender: <br></br>
<input></input>Male<br></br>
<input></input>Female<br></br>
<input></input>Other<br></br>
</form>

85
Q

How do we create checkboxes?

A

We create a form element and within that element we add the input element and set the type to checkbox.

Ex:

<form>
Pets: <br></br>
<input></input>Cats<br></br>
<input></input>Dogs<br></br>
</form>

86
Q

How do you create a dropdown field?

A

Create a select element and within that element add an option element. Set the value attribute to the option available in the dropdown field. Make sure to close the option tag.

Ex:
Cars: <br></br>
<select>
<option>Volvo</option>
<option>Audi</option>
<option>BMW</option>
<option>Jaguar</option>
</select><br></br>

Front End Web Development (7 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions