Brainscape's Knowledge GenomeTM

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


See full index

LPI - 03 Web Development Essentials > Topic 032: HTML Document Markup > Flashcards

Topic 032: HTML Document Markup Flashcards

1
Q

a markup language that tells web browsers how to structure and display web pages. The current version is 5.0, which was released in 2012. The HTML syntax is defined by the World Wide Web Consortium (W3C).
HTML is a fundamental skill in web development, as it defines the structure and a good deal of the appearance of a website. If you want a career in web development, HTML is definitely a good starting point.

A

HTML (HyperText Markup Language)

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

consist of angle brackets
around a tag name, for example <title>. The tag name is not case-sensitive, although the World Wide Web Consortium (W3C) recommends using lowercase letters in current versions of HTML</title>

A

Tags

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

HTML Tags are used to build

A

elements

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

opening tag of an HTML element that defines the title of an HTML document.

A

<title>
</title>

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

Encloses the entire HTML document. This contains all the tags that make up the page. It also indicates that the content of this file is in HTML language. Its corresponding closing tag is </html>.

A

<html>
</html>

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

A container for all meta information regarding the page. The corresponding closing tag of this element is </head>

A

<head>
</head>

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

A container for the page content and its structural representation. Its corresponding closing tag is </body>.

A

<body>
</body>

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

The <html>, <head>, <body> and <title> tags , which provide the basic structure of an HTML document. In particular, they tell the web browser that it is reading an HTML page.</title>

A

are so-called skeleton tags

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

is not an HTML tag, but an instruction for the web browser that specifies
the HTML version used in the document. In the basic HTML document structure shown earlier, <!DOCTYPE html> was used, specifying that HTML5 is used in this document

A

<!DOCTYPE>

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

WARNING

A

Comments can not be nested

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

HTML tags may include one or more of these that specify details of HTML elements.

Must always be set on the opening tab

Consists of a name that indicates the property that should be set, an equal sign and the desired value within quotes.

A

attributes

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

attributes that can be used on any HTML element

A

Core Attributes

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

Core attribute that describes the content of the element. Its value is often displayed as a tooltip that is shown when the user moves their cursor over the element.

A

title

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

Core attribute that associates a unique identifier with an element. This identifier must be unique within the document, and the document will not validate when multiple elements share the same id.

A

id

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

Core attribute that assigns graphic properties (CSS styles) to the element.

A

style

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

Core attribute that specifies the language of the element content using ISO-639 standard two-character language codes

A

lang

17
Q

The developer can store custom information about an element by defining a so-
called “ “ that is indicated by prefixing the desired name with data- as in -additionalinfo

A

data- attribute

18
Q

Other attributes are specific to each HTML element. For example, the src attribute of an HTML <img></img> element specifies the URL of an image. There are many more specific attributes, which will be covered in the following lessons

A

Specific Attributes

19
Q

defines meta information regarding the page and is described by the

<head> element

by default the info within is not rendered by the web broswer.
</head>

A

The document header

20
Q

What is it not recommended to do with the <head> element

A

To contain HTML elements that could be dislayed on the page.

21
Q

defined between the tags appears in the web bowser title bar and is the suggested name for the bookmark when you try to bookmark the page. It is also displayed in search engine results as the title of the page.

A

title

<title>
</title>

22
Q

Used to specify meta information to further describe the content of an HTML document.

A

<meta></meta>

element

23
Q

Element that defines what metadata will be described in this element. It can be set to any custom defined value, but commonly used values are author, description, and keywords

A

name

24
Q

Element that provides an HTTP header for the value of the content attribute. A common value is refresh, which will be explained later. If this attribute is set, the name attribute should not be set.

A

http-equiv

25
Q

Element that provides the value associated with the name or http-equiv attribute.

A

content

26
Q

Element that specifies the character encoding for the HTML document, for example utf-8 to set it to Unicode Transformation Format — 8-bit

A

charset

27
Q

For each of the following tags, indicate the corresponding closing tag

A

<body> </body>

<head> </head>

<html> </html>

<meta></meta>

None

<title> </title>

28
Q

For each of the following tags, indicate whether it marks the beginning of a block or inline
element

A

<h3> Block Element
<span> Inline Element
<b> Inline Element
<div> Block Element
<em> Inline Element
<dl> Block Element
<li> Block Element
<nav> Block Element
<code> Inline Element
<pre> Block Element
</pre></code></nav></li></dl></em></div></b></span></h3>

29
Q

What kind of lists can you create in HTML? Which tags should you use for each of them?

A

In HTML, you can create three types of lists: ordered lists consisting of a series of numbered list
items, unordered lists consisting of a series of list items that have no special order or sequence,
and description lists representing entries as in a dictionary or encyclopedia. An ordered list is
enclosed between the <ol> and </ol> tags, an unordered list is enclosed between the <ul> and
</ul> tags, and a description list is enclosed between the <dl> and </dl> tags. Each item in an ordered or unordered list is enclosed between the <li> and </li> tags, while each term in a
description list is enclosed between the <dt> and </dt> tags and its description is enclosed
between the <dd> and </dd> tags.

30
Q

What tags enclose the block elements that you can use to structure an HTML page?

A

The <header> and </header> tags enclose the page header, the <main> and </main> tags
enclose the main content of the HTML page, the <nav> and </nav> tags enclose the so-called
navigation bar, the <aside> and </aside> tags enclose the sidebar, and the <footer> and
</footer> tags enclose the page footer.

31
Q

Create a basic HTML page with the title “Form Rules”. You will use this HTML page for all
explorational exercises, each of which is based on the previous ones. Then add a level 1
heading with the text “How to fill in the request form”, a paragraph with the text “To receive
the PDF document with the complete HTML course, it is necessary to fill in the following
fields:” and an unordered list with the following list items: “Name”, “Surname”, “Email
Address”, “Nation”, “Country”, and “Zip/Postal Code”.

A

<!DOCTYPE html>

<html>
<head>
<title>Form Rules</title>
</head>
<body>
<h1>How to fill in the request form</h1>
<p>
To receive the PDF document with the complete HTML course, it is necessary
to fill in the following fields:
</p>
<ul>
<li>Name</li>
<li>Surname</li>
<li>Email Address</li>
<li>Nation</li>
<li>Country</li>
<li>Zip/Postal Code</li>
</ul>
</body>
</html>

32
Q

Put the first three fields (“Name”, “Surname”, and “Email Address”) in bold, while also adding
semantic importance. Then add a level 2 heading with the text “Required fields” and a
paragraph with the text “Bold fields are mandatory.”

A

<!DOCTYPE html>

<html>
<head>
<title>Form Rules</title>
</head>

<body>
<h1>How to fill in the request form</h1>
<p>
To receive the PDF document with the complete HTML course, it is necessary
to fill in the following fields:
</p>
<ul>
<li><strong> Name </strong></li>
<li><strong> Surname </strong></li>
<li><strong> Email Address </strong></li>
<li>Nation</li>
<li>Country</li>
<li>Zip/Postal Code</li>
</ul>
<h2>Required fields</h2>
<p>Bold fields are mandatory.</p>
</body>
</html>

33
Q

Add another level 2 heading with the text “Steps to follow”, a paragraph with the text “There
are four steps to follow:”, and an ordered list with the following list items: “Fill in the fields”,
“Click the Submit button”, “Check your e-mail and confirm your request by clicking on the link
you receive”, and “Check your e-mail - You will receive the full HTML course in minutes”

A

<!DOCTYPE html>

<html>
<head>
<title>Form Rules</title>
</head>
<body>
<h1>How to fill in the request form</h1>
<p>
To receive the PDF document with the complete HTML course, it is necessary
to fill in the following fields:
</p>
<ul>
<li><strong> Name </strong></li>
<li><strong> Surname </strong></li>
<li><strong> Email Address </strong></li>
<li>Nation</li
<li>Country</li>
<li>Zip/Postal Code</li>
</ul>
<h2>Required fields</h2>
<p>Bold fields are mandatory.</p>
<h2>Steps to follow</h2>
<p>There are four steps to follow:</p>
<ol>
<li>Fill in the fields</li>
<li>Click the Submit button</li>
<li>
Check your e-mail and confirm your request by clicking on the link you
receive
</li>
<li>
Check your e-mail - You will receive the full HTML course in minutes
</li>
</ol>
</body>
</html>
</li></ul></body></html>

34
Q

Using <div>, create a block for each section that starts with a level 2 heading.

A

!DOCTYPE html>

<html>
<head>
<title>Form Rules</title>
</head>
<body>
<h1>How to fill in the request form</h1>
<p>
To receive the PDF document with the complete HTML course, it is necessary
to fill in the following fields:
</p>
<ul>
<li><strong> Name </strong></li>
<li><strong> Surname </strong></li>
<li><strong> Email Address </strong></li>
<li>Nation</li>
<li>Country</li>
<li>Zip/Postal Code</li>
</ul>
<div>
<h2>Required fields</h2>
<p>Bold fields are mandatory.</p>
</div>
<div>
<h2>Steps to follow</h2>
<p>There are four steps to follow:</p>
<ol>
<li>Fill in the fields</li>
<li>Click the Submit button</li>
<li>
Check your e-mail and confirm your request by clicking on the link you
receive
</li>
<li>
Check your e-mail - You will receive the full HTML course in minutes
</li>
</ol>
</div>
</body>
</html>

35
Q

Using <div>, create another block for the section starting with the level 1 heading. Then divide
this section from the other two with an horizontal line.

A

<!DOCTYPE html>

<html>
<head>
<title>Form Rules</title>
</head>
<body>
<div>
<h1>How to fill in the request form</h1>
<p>
To receive the PDF document with the complete HTML course, it is
necessary to fill in the following fields:
</p>
<ul
<li><strong> Name </strong></li>
<li><strong> Surname </strong></li>
<li><strong> Email Address </strong></li>
<li>Nation</li>
<li>Country</li>
<li>Zip/Postal Code</li>
</ul>
</div>
<hr></hr>
<div>
<h2>Required fields</h2>
<p>Bold fields are mandatory.</p>
</div>
<div>
<h2>Steps to follow</h2>
<p>There are four steps to follow:</p>
<ol>
<li>Fill in the fields</li>
<li>Click the Submit button</li>
<li>
Check your e-mail and confirm your request by clicking on the link you
receive
</li>
<li>
Check your e-mail - You will receive the full HTML course in minutes
</li>
</ol>
</div>
</body>
</html
</html>

36
Q

Add the header element with the text “Form Rules - 2021” and the footer element with the text
“Copyright Note - 2021”. Finally, add the main element that must contain the three <div>
blocks

A

<!DOCTYPE html>

<html>
<head>
<title>Form Rules</title>
</head>

body>
<header>
<h1>Form Rules - 2021</h1>
</header>
<main>
<div>
<h1>How to fill in the request form</h1>
<p>
To receive the PDF document with the complete HTML course, it is
necessary to fill in the following fields:
</p>
<ul>
<li><strong> Name </strong></li>
<li><strong> Surname </strong></li>
<li><strong> Email Address </strong></li>
<li>Nation</li>
<li>Country</li>
<li>Zip/Postal Code</li>
</ul>
</div>
<hr></hr>
<div>
<h2>Required fields</h2>
<p>Bold fields are mandatory.</p>
</div>
<div>
<h2>Steps to follow</h2>
<p>There are four steps to follow:</p>
<ol>
<li>Fill in the fields</li>
<li>Click the Submit button</li>
<li>
Check your e-mail and confirm your request by clicking on the link
you receive
</li>
<li>
Check your e-mail - You will receive the full HTML course in minutes
</li>
</ol>
</div>
</main>
<footer>
<p>Copyright Note - 2021</p>
</footer>
</body>
</html>

LPI - 03 Web Development Essentials (10 decks)

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