HTML Flashcards

1
Q

What does HTML stand for?

A

HyperText Markup Language

A language for annotating text so that it can link to other texts… Also images, videos, sounds, etc

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

HTML is interpreted… meaning:

A

A browser interprets HTML and displays it according to its meaning.

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

The first line of a HTML 5 document should be:

A
The doctype (version description)
<!DOCTYPE html>

EVERYTHING ELSE IS INSIDE THE <html> TAGS

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

Empty tags

A

Tags that do not enclose any text… e.g. a line break <br></br> or an image <img … >

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

Tag attributes

A

-Added information in the start tag
(attributeName=”attributeValue”)
E.g.: source of the image: < img src=”test.jpg” >

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

ID

A

Used to identify a single element… no dublicates!!

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

Class

A

Used to identify a group of elements

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

HTML Head

A
  • Meta information
  • Page title < title > MyTitle < /title > Typically displayed in the browser bar

-Page encoding < meta charset=”UTF-8” >

-Page information in meta tags, name=”keywords” content=”the…content!”
SEARCH ENGINES LOVE METADATA!!!

-Inclusion of CSS docs and scripts

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

HTML Body

A

Contains the actual content that is rendered by the browser

  • Text
  • Links
  • Images
  • Videos
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Headings

A

< h1 > to < h6 > semantically most important to least important… SEMANTICALLY.

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

Paragraphs

A

< p &gt paragraph :P < /p &gt

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

Images

A

< img src=”source.png” alt=”description” &gt

empty tag

Image source is given by src attribute

alt attribute is for a description for when the image does not load or for screen readers… helps the blind

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

Lists

A

Unordered or Ordered lists
< ul &gt and < ol &gt

list items are enclosed with < li &gt list item < /li &gt

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

Hyperlinks

A

< a href=”someURL.bla” target=”_blank” &gt here < /a &gt

Defines a hyperlink to another resource

href is the target url

target defines how to open the link…

  • _blank : in another window/tap
  • _self: in the same window
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Hyperlink within a document

A

Give an ID to an HTML element with the id attribute

Link with href to that attribute

Can be appended on an absolute and relative url

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

Tables

A

All enclosed in a < table &gt < /table &gt tag

< thead &gt < /thead &gt encloses the head

< body &gt < /body &gt encloses the table body

< tr &gt < /tr &gt defines a row

< th &gt < /th &gt defines a cell in the thead

< td &gt < /td &gt defines a cell (not in thead)

< caption &gt < /caption &gt defines the table caption (title)

17
Q

Divs

A
  • Divisions
  • Invisible containers
  • Cause line break

< div &gt < /div &gt

You put other kinds of tags in them

Used heavily for layouting with CSS

18
Q

Forms

A

-Used to cellect input
-Contain input fields, buttons, checkboxes etc:
< form action=”whereToSendThis” method=”get” &gt < /form &gt

inside these there would be fx:
User: < input type=”text” name=”user” &gt < br &gt

< input type=”submit” onclick=”do()” value=”Login” &gt

19
Q

The different form elements:

A
Input field (text):
< input type="text" value="Default User" &amp;gt

Submit button:
< input type=”submit” value=”Submit” &gt

Radio button:
< input type=”radio” name=”role” value=”usr &gtUser

Checkbox:
< input type=”checkbox” name=”check” value=”check1” &gtItem 1

Dropdown menu:
< select name=”cars” &gt < /select &gt

and in those are:
< option value=”volvo” &gt Volvo < /option &gt

-Disabled elements cant be modified
< input type=”text” disabled value=”Default User” &gt

Text area(multi line)
< textarea name="message" rows="10" cols="10" > Default < /textarea >

Group items using fieldset
< fieldset &gt < /fieldset &gt

in those you can set < legend &gt < /legend &gt to name the fieldset.

20
Q

Form submision

A

Only takes GET and POST as methods

GET: form data is appendet to URL

POST: variables are included in request body

21
Q

Block vs Inline Elements

A

Block elements start in a new lina and take as much width as possible

Inline elements start from the current position, take as much space as needed

22
Q

Accessibility

A

Sematic elements… header carries meaning and fx titles on hyperlinks and images

meta tags to give info on your website