HTML Flashcards

1
Q

HTML stands for ______.

What is Hypertext?

What is a Markup Language?

A

Hyper Text Markup Language

Hypertext is text containing a link.

A markup language is a programming language used to make text do more than just sit on a page: it can turn text into images, links, tables, lists, and much more.

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

Where does <!DOCTYPE html > go?

What does it do?

A

At the beginning of your document.

Tells the browser what language your page is using (here it’s html).

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

a. Always put < ___ > on the first line. This tells the browser what language it’s reading (in this case, HTML).
b. Always put < ___ > on the next line. This starts the HTML document.
c. Always put < ___ > on the last line. This ends the HTML document.

A

a. !DOCTYPE html
b. html
c. /html

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

Things inside < >s are called ____.
____ nearly always come in pairs: an opening ____ and a closing ____.
Example of opening: <html>
Example of closing: < /html>

A

tags; tag

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

In what order should tags be closed in?

A

The same order they are opened in.

Example:

< first tag >< second tag >Some text!< /second tag >< /first tag >

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

There are always two parts to an HTML file: the ____ and the body.

The ____ contains information about your HTML file, like its title. The title is what we see in the browser’s title bar or page tab.

A

head

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

What is the following code representing?

< head >

< title >My Webpage< /title >

< /head>

A

The head of an HTML document.

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

The ____ is where you put your content, such as text, images, and links. The content in the ____ is what will be visible on the actual page.

A

body

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

< h1 > and < h6 > are examples of _____.

HTML has how many heading sizes?

A

heading tags

six

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

You’ve done an awesome job! Here’s a quick summary of things we’ve learned:

  1. HTML is used to give websites _____.
  2. We open HTML files using a browser, and the browser** **_____ (shows us) the file.
  3. HTML files have a < _____ > and a < _____ > (just like you!)
  4. In the head, we have the < ____ > tags, and we use these to specify the webpage’s name.
  5. How to make headings and paragraphs.
A
  1. structure
  2. renders
  3. head, body
  4. title
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q
  1. What element is used to send the user to another part of your website, or another website?
  2. What is the complete tag for creating one?
A
  1. hyperlink
  2. < a href=”www.codecademy.com”> < /a>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q
  1. What tag is used to add images to a webpage?
  2. What do most HTML elements have that an image element does not?
A
  1. < img src=”url” />
  2. a closing tag; a backslash is included in the initial tag to close it
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q
  1. What is the following an example of?< a href=”www.codecademy.com” >< img src=”http://s3.amazonaws.com/codecademy-blog/assets/f3a16fb6.jpg” />< /a>
A
  1. An image as a hyperlink.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What is the basic HTML structure for every webpage in tags?

A

< !DOCTYPE html>

< html>
< head>< title>Anneri’s Webpage< /title>< /head>
< body>< /body>
< /html>

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

When you place tags inside of other tags, _____ helps make your code readable.

A

indentation

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q
  1. An ______ is a list that is numbered.
  2. What is the tag to create an ordered list?
  3. What tag is used for an unordered list?
A
  1. ordered list
  2. < ol>
  3. < ul>
17
Q
  1. To create an item in an ordered list, wrap with the ___ & ___ tags.
A
  1. < li> < /li>
18
Q

________ is CSS that can be used to style HTML without creating a separate document.

A

inline CSS

19
Q

Comments start with ___ and end with ___ like this:

A

<!-- , -->

< !– , –>

< !– This is an example of a comment! –>

<!-- This is an example of a comment! -->

20
Q

We can give tags more instructions by including _____ in the opening tag.

An _____ is simply a characteristic or some description for the content in the element.

Let’s change the size of the text. How? We use the _____ attribute. We make it equal to font-size, followed by a colon, the size you want, and end it with px(short for “pixels”). For example:

< p style=”font-size: 12px”>

A

attributes

attribute

style

21
Q

_______ is used to decide what font type to use.

A

font-family

22
Q

a. font-size: 14px
b. color: orange
c. font-family: Bodoni

These are all examples of the _____ attribute.

A

style

23
Q

What is the style attribute for setting the color of a background?

A

< p1 style=”background-color: green;”>

24
Q

The style attribute to align text

A

< h1 style=”text-align:center”>

25
Q
  1. What does the tag < strong> do?
  2. What about the tag < em>?
A
  1. bolds text
  2. italicizes, or emphasizes text
26
Q
  1. What is the tag for creating a table?
  2. What does < tr> do?
  3. How do you create a column?
  4. What is the tag for a table header?
A
  1. < table> < /table>
  2. Creates a table row.
  3. < td> < /td>
  4. < th> < /th>
27
Q
  1. What attribute can you pair with < th> to stretch the element across more than one table column?
  2. What would the tag for a table header that stretches across a three-column table look like?
A
  1. colspan
  2. < th colspan=”3”>
28
Q

How do you add multiple style attributes to the same element?

A

separate attributes with a semi-colon

Example:

< th colspan=”2”; style=”color:red”>Famous Monsters by Birth Year< /th>

29
Q
  1. What does the < div> tag do?
  2. What is “div” short for?
  3. What does using the div tag enable you to do style-wise?
A
  1. Divides your page into “containers” or boxes.
  2. Division
  3. Using the div tag lets you style individual pieces of your content separately.
30
Q

While < div> allows you to divide your webpage up into pieces you can style individually, < ____> allows you to control styling for smaller parts of your page, such as text.

A

span

Example:

< p>This text is black, except for the word < span style=”color:red”>red!< /span>< /p>