Brainscape's Knowledge GenomeTM

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


See full index

100DEVs > HTML Basics > Flashcards

HTML Basics Flashcards

1
Q

What’s an ID? how often can it be used?

A

ID = way to mark a code in HTML for CSS. Only one ID value per document.

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

What’s a class? How often can you use it?

A

Way to mark an element in HTML for CSS. Can be used multiple times.

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

ID vs class?

A

ID value = x1 use

Class value = x many many times. Good for grouping.

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

What is the lowest specificity weight? How much?

A

Tags are only one point

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

Which thing in HTML has the highest specificity weight? How much?

A

An inline style = 1000pts

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

Rank the following in specificity points: how many each?

ID, class, tags

A 
ID = 100 points
Class = 10 points
Tags = 1
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What examples of inline styles worth 1000 specificity points?

A

!important (bang important)

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

What’s a bang important? How and where to write it?

A

Bang important = most important code in your sheet for CSS.

Write in VSS declaration after value:
Color: red !important;

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

When’s the only time you should bang important?

A

Right before a deadline to string quick CSS together.

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

What’s an element? Give an example code.

A

Element = name of your structure. Ex. A, p, div

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

What are tags?

A

Carrots/ brackets + element

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

What are HTML attributes? Where do they go? Write example.

A

Gives more information to an element.
Go inside OPENING tag.
Ex. <a>click here</a>

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

What are all important structures in an HTML document. (From start to finish)

A 
!DOCTYPE html
Html
Head
Body
/html
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What part of an HTML document tells us what version of the HTML it is? Where does it go?

A

The document type declaration or doc type, “!DOCTYPE html” goes @ top first.

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

What are semantics

A

Meaning/purpose behind an HTML content

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

What 2 elements in HTML have NO semantic value (only for styling purposes)

A

DIVs and Spans

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

Block vs inline elements

A

Block start on their own line and stack on each other. For bigger content.
Inline start at next space in a content line. For smaller content.

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

Can Block elements wrap inline elements? What about the opposite?

A

Yes. And no.

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

How to write an HTML comment?

A

<!—content—>

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

Difference between strong & b element

A 
Strong = strong semantic importance
B= stylistically different text
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

You want to make “study” bolded and important in the following HTML. How do you write?

P< it’s really important to study every day >

A

P < its really important to < strong > study < / strong > every day < / P > < / strong >

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

What 2 elements to italicize text in HTML? How are they different?

A

< em > = stressed emphasis

< i > = alternative voice or tone * good for quotes

23
Q

You want to group some content at the TOP of your webpage. What structure element to use?

A

Header

24
Q

You want to group some content at the BOTTOM of your webpage. What structure element to use?

A

Footer

25
Q

Header vs head vs h1

A 
Header = content  at top of page
Head = meta data
H1 = important content title
26
Q

You want to make a section for navigation links, table of contents, previous/next links… what section element to use?

A

< nav >

27
Q

What’s an article element?

A

< article > = For text that can be used independently. (Ex. Blog posts)

28
Q

what is the best content to use for < aside > elements?

A

Sidebars, notes, brief explanations, “tips” sections, inserts

29
Q

Where to find codes for special characters in HTML?

A

Copy paste character.com

30
Q

How to code a hyperlink

A

< a href= “website url” > content < / a >

31
Q

Can you make an entire block of content, a hyperlink? How?

A

Yes. Use anchor element < a >

32
Q

What are two common types of links

A

To other pages

To other websites

33
Q

Another name for href

A

A path

34
Q

What href (path) to put when linking to another page on the same website?

A

Use a RELATIVE path. Href = “file NAME of link page”

35
Q

Relative vs absolute paths (hrefs)

A

Relative = direction to file name or page

Absolute = exact address

36
Q

How to create an email link in HTML

A

Href = “ mailto: davidaych@gmail.com”

37
Q

How do you program a subject into an html email hyperlink?

A

After the email hyperlink, write: ? Subject=content

Spaces = %20

38
Q

How to add a body to an html email hyperlink?

A

If subject is coded, attach w/ &
If no subject coded, attach to hyperlink via ?

Code: body=content
Space = %20
Enter= %0A

39
Q

How to code a hyperlink to open in a NEW window. Give example

A 
Attribute = target
Value = _blank

Ex. < a href= “website URL” target= “_blank” > content < / a >

40
Q

How do you link to different parts of the same page?

A

Put your ID in your destination

Chose your hyperlink location and Put your ID in it.
Ex: < a href= “# ID name” > content < / a >

41
Q

Does letter casing matter in HTML? What’s the best practice?

A

No. General practice = all lower case

42
Q

What parts comprise an element?

A

Open and closing tag + content

43
Q

What types of elements should you always include the head of your html? Describe each.

A

< meta charset= “ utf-8 “ > for character sets

< title > for tab titles

44
Q

Why do some tags not need a closing tag? What are these called?

A

Because the tag itself is already the content (ex. An image tag). These are called self-closing tags.

45
Q

Why is it important to follow HTML rules? (3 reasons)

A
  1. Better user experience (ex. Broken image link will still show image label)
  2. Accessibility (ex. Screen readers)
  3. SEO - search engine optimization (better result in google searches)
46
Q

What is the shortcut to creating an HTML document structure?

A

Save doc as an HTML document.

At top, write HTML and click “HTML 5”

47
Q

What is the progressive enhancement concept? Why is it important?

A

Think of an Peanut M&M

Core of website = content (HTML)

Chocolate coating = presentation (CSS)

Thin candy wrap = client-side script (JS)

Not everyone has good access. Remember this model to build max accessibility for all.

48
Q

What meta data should you always include in your HTML documents? Where do you write it?

A

Character sets, description, title, links.

49
Q

How do you code character sets into your HTML? Where?

A

In the head:

< meta charset = “ utf - 8 “ >

50
Q

How do you code a description for your webpage that won’t be visible to visitors?

A

In head;

< meta name = “ description “ content = “ write your description “ >

51
Q

How do you code keywords into your html for search engine optimization?

A

In head:

< meta name = “ keywords “ content “ word 1 , word 2, word 3… “ >

52
Q

How do you write the title for your page to show on the browser tab?

A

In head:

< title >

53
Q

How and where do you set the language of your html doc?

A

In root tag (html)

< html lang = “ en “ >

54
Q

What image formats are the most supported across all browsers? How are they different?

A

Gif, jpg, png

Jpg = best quality photos
PNG = lower color/transparency. Great for icons  or background patterns.

100DEVs (9 decks)

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