Html Flashcards

1
Q

What are HTML elements?

A

Pieces of contents wrapped in opening and closing tag. Ex. <p> </p>

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

What are opening tags? Purpose?

A

Comprise of a keyword enclosed in angle brackets <>. They tell the browser this is the start of an HTML element. Ex. <p>

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

What are closing tags? Purpose?

A

Almost the same as opening tags but they have a forward slash before the keyword. That tell the browser where and element ends. Ex. </p>

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

What is the purpose of elements?

A

Containers for contents.
The element tells the browser what the info is to determine how it should interpret and format the content.

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

Purpose of tags?

A

The tags tell the browser the content of the element.

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

Define self closing tags (empty elements)

A

They don’t wrap around any elements. Ex. <br></br> or <img></img>

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

What is the purpose of the (.html) extension?

A

To let the computer know we want to create an HTML file

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

Purpose of naming an html file (index)? (❗️)

A

The html file named index is where web server will look for by default as the homepage of the website

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

What is the Doctype declaration?

A

<!DOCTYPE html>

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

What is the purpose of Doctype?

A

It is to tell the browser what version of HTML it should use to render the page.

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

What is the <html> element? (❗️)

A

This is known as the root element of the page - this means every other element will be a descendant of it.

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

What is the function of the lang attribute? (❗️)
lang=en

A

Specifies the language of the text content in that element

Put inside the html element

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

What is the purpose of the lang attribute?

A

Primarily used for improving accessibility of the web page. For assistive tech like the screen reader to adapt according to the language.

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

What is the function of the head element? (❗️)

A

It’s where the important meta-info about the webpage, and stuff it requires to render properly are stored.

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

What to not use in the head element?

A

Any element that displays content on the webpage.

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

What is the charset encoding? (❗️)

A

<meta charset=“UTF-8”>

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

What is the function and purpose of the charset encoding?

A

It ensures that the webpage will display special symbols and characters from different languages correctly in the browser.

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

What is the function and purpose <title> element? (❗️)</title>

A

Used to give webpages a human-readable title which is displayed in our webpages browser.

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

What is the function and purpose of the <body> element?

A

This is where all the content that will be displayed to users will go. (The text, images, lists, links etc.)

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

How to view files in browser?

A

google-chrome file.extension

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

What is the boilerplate?

A

The backbone of ever html page.

<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset=“UTF-8”>
<title> </title>
</head>
<body>
<h1> </h1>
</body>
</html>

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

What’s the paragraph element?

A

<p> </p>

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

Function of the paragraph element?

A

Adds a newline after each of our paragraphs.

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

Explain the 6 different levels of headings.

A

From <h1> the biggest to <h6> the tiniest.

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

Purpose of <h1> element?

A

Use for the heading of the overall page.

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

What is the <strong> element function?</strong>

A

Makes the text bold. It also semantically marks text as important.

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

What is the <em> element function?</em>

A

Makes the text italic. Semantically places emphasis on the text.

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

What is nesting elements?

A

We indent any elements that are within other elements.

29
Q

What happens when you nest elements?

A

U create a parent and child relationship

30
Q

When nesting element siblings means?

A

Elements nested on the same level

31
Q

What are the purpose and functions of html comments?

A

Comments that are not visible in browser and that allows u to comment on your code to get some context on unclear things u wrote.

32
Q

What is an HTML comment? (❗️)

A

<!— —>

33
Q

What is the purpose of unordered list?

A

List of items where the order doesn’t matter.

34
Q

How to create an unordered list? And items in them?

A

Use the <ul> element

Use the <li> element to create each item.

<li> is the child of <ul>
</ul></li>

35
Q

Purpose of ordered list?

A

If you want to create a list of items where the order does matter.

36
Q

How to create ordered list? And items in it?

A

Use the <ol> element.
Use the <li> element to create each list item.

37
Q

What is used to create links in html?

A

The anchor element

38
Q

What is the anchor element?

A

Wrapping the text or another HTML element we want to be a link with an <a> tag.</a>

39
Q

What does an anchor tag need to function?

A

An href attribute

40
Q

What does an HTML attribute always look like?

A

Always in the opening tag
Made of a name and a value usually
Not all attribute require a value.

41
Q

What is the function of an HTML attribute?

A

Gives additional info to an HTML element.

42
Q

What is the value of a href attribute?

A

The destinations we want out link to go to.

43
Q

What are absolute links?

A

Links to pages on other websites on the internet

44
Q

What does a typical absolute link look like?

A

protocol://domain/path

45
Q

What are relative links?

A

Links to other page within our website

46
Q

What does a typical relative link look like and why?

A

It assumes the domain name will be the same as the page the link was created on hence only a file path

47
Q

What does ./ do?

A

Specifies to your code that it should start looking for the file/directory relative to the current directory.

48
Q

How to display an image in HTML?

A

Use the <img></img> element. Which is self closing

49
Q

How does the self closing <img></img> element embeds images? (❗️)

A

It uses a src attribute that tells the browser where the image file is located.

50
Q

What is the purpose of the alt attribute in the <img></img> element? Purpose?

A

Used to describe an image.
If the image can’t load.
Used for screen readers too

51
Q

What are four main image formats?

A

Jpg, PNG, SVG, GIF

52
Q

Website File naming guide

A

No uppercase
No numbers
No Space

53
Q

What is a commit?

A

A snapshot of your code at the moment the commit was made.

54
Q

What does a commit do?

A

Saves a version of your code up to that point.

55
Q

When to make a commit?

A

Meaningful changes.
Fix a typo, bug, and working function etc.

56
Q

What is the first rule of a great Git commit message?

A
  1. Separate subject from body with a blank line
57
Q

What is the second rule of a great Git commit message?

A

Limit the subject line to 50 characters

58
Q

What is the third rule of a great Git commit message?

A

Capitalize the subject line

59
Q

What is the fourth rule of a great Git commit message?

A

Do not end the subject line with a period

60
Q

What is the fifth rule of a great Git commit message?

A

Use the imperative mood in the subject line

61
Q

What is the sixth rule of a great Git commit message?

A

Wrap the body in 72 characters

62
Q

What is the seventh rule of a great Git commit message?

A

Use the body to explain what and why vs how

63
Q

How to commit a single line of change(subject) in the command line?

A

[git commit -m “(change)”]

64
Q

Where to write commit messages with a body?

A

In a text editor

65
Q

Purpose of [git log —oneline]

A

Prints out the subject line

66
Q

Function of git shortlog?

A

Group commits by user, showing the subject line to be concise

67
Q

Imperative meaning

A

Spoken or written as if giving a command or action

68
Q

How to write imperative subject lines?

A

Use: if applied, this commit will…

69
Q

What is a <div> element?

A

Simply an empty container.