HTML Flashcards

1
Q

Every page must have one!

A

<title></title>

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

Headings

A

<h1></h1>

… <h6></h6>

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

Paragraph.

A

<p></p>

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

Emphasis and
Strong emphasis.

A

<em></em>
<strong></strong>

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

Parts of a document.

A

<header></header>

<article></article>

<section></section>

<footer></footer>

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

Anchor

A

<a></a>

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

Bullet and numbered lists

A

<ul></ul>

<ol></ol>

<li></li>

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

A markup language

A

A markup language is one that is designed for defining and presenting text. HTML (HyperText Markup Language), is an example of a markup language. Within a text file such as an HTML file, elements are marked up using tags which explain the purpose of that part of the content.
Procedural and Descriptive are too key elements.

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

HTML: Tags, Elements, Open and Close

A

<html>

</html>

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

HTML Attributes

A

<a>

</a>

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

head

A

<!doctype html>

<title>HTML Example</title>

<meta></meta>

<meta></meta>

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

body

A

<header>
<h1>HTML Example</h1>
<p>Matt Dennis
<p>March 2020
</header>

<section>
<h1>Introduction</h1>
<p>Paragraph Text.
<p>Isn't it pretty…?
<em>Less so.</em>
</section>
</p></p></section></p></p></header>

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

Procedural

A

What to do.
How it looks.
Not why to do it.

e.g.
<b>words</b>

<hr></hr>

<br></br>

<blink>words</blink>

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

Descriptive

A

What it means.
Not how it looks or what to do.

e.g.

<h1>words</h1>

<p>para words
<em>words</em>
</p>

<aside>words</aside>

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

Stratified

A

Separates content from presentation.

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

Semantic

A

Enables machine processing.

17
Q

Dynamic

A

Different presentation to suit circumstances.

18
Q

URLs

A

Uniform Resource Locators (URLs)

https://port.ac.uk/

http://www.example.com/forum/questions/?tag=networking&order=newest#top

. typed into an address bar
. hyperlinks (<a></a>)
. src attribute on elements

19
Q

URL Structure

A

Scheme: This part indicates the protocol used to access the resource. Common schemes include http, https, ftp, mailto, etc. For example, in “https://www.example.com”, “https” is the scheme.

Host: This specifies the domain or IP address of the server hosting the resource. In the example “https://www.example.com”, “www.example.com” is the host.

Port (optional): This part, if present, specifies the port number on the server to which the client should connect. The default port for HTTP is 80, and for HTTPS is 443. If the port is not specified, it is assumed to be the default for the given scheme.

Path: The path indicates the specific resource or location on the server. For example, in “https://www.example.com/products/shoes”, “/products/shoes” is the path.

Query (optional): This part is used for passing parameters to the resource. It starts with a question mark (?) and consists of key-value pairs separated by ampersands (&). For example, in “https://www.example.com/search?q=shoes&category=sport”, “?q=shoes&category=sport” is the query.

Fragment (optional): The fragment identifier is used to point to a specific section within the resource. It starts with a hash (#). For example, in “https://www.example.com/page#section1”, “#section1” is the fragment.

20
Q

Absolute vs Relative URLs

A

Absolute URLs include the scheme:
<a>BBC News</a>

Relative URLs refer to resources on the same server:
<a>Contact us</a>
(request contact.html at the same host and path as current resource)

<a>Head home</a>
(request index.html in the path ‘above’)

21
Q

A CSS Rule

A

p {
background: red;
color: white;
padding: 1em;

p = selectors
{} = blocks
background, color, padding = properties
red, white, 1em = values
:, ; = punctuation

22
Q

CSS

A

Cascading Style Sheets
Since ~1997
A W3C standard
for styling HTML
Text files
(human readable)
Files contain rules
You define the rules