Brainscape's Knowledge GenomeTM

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


See full index

Complete Web Development - Udemy > Section 5 - Introduction to CSS > Flashcards

Section 5 - Introduction to CSS Flashcards

1
Q

What does CSS stand for?

A

Cascading Style Sheets

(applied like a waterfall)

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

What is Style Sheet (SS) language?

A

a type of language (similar to how HTML is a markup language)

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

What is the most important Style Sheet (SS) language to know for web developers?

A

Cascading Style Sheets (CSS)

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

What are the 3 ways we can add CSS to our HTML website?

A
  1. Inline
  2. Internal
  3. External
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What is the style attribute?

A

an attribute that is globally available to all tags (not just HTML like image, break, etc)

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

With CSS, when is inline used?

A

when adding CSS style to a single element on your HTML page

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

Where do you place inline CSS?

A

goes in the same line as a particular HTML element in the opening tag

<html>
</html>

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

Attributes normally have what 2 defining characteristics?

A
  1. A name for the attribute
  2. A value for the attribute

<html>

style = name
background: blue = value
</html>

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

What do you add in the value section of an attribute (in terms of CSS?)

A

you add the CSS code

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

In the value section where we add our CSS code, what are the 2 ways it’s broken down?

A
  1. First part is the property you want to change (background)
  2. Second part is the value of that property that you want to set it to

<html>
</html>

background = property you want to change
blue = value you want to set it to

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

What is the special HTML tag to addinternal CSS?

A

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

When do you add internal CSS?

A

when you want to add CSS to a single HTML document (not a multi-page website)

[can apply to anywhere in our HTML, and inside target as many elements as we want]

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

Where do you add internal CSS?

A

Developers usually put it in the head section, but it can be applied anywhere within the HTML document

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

Besides adding the special HTML tag for internal CSS, what else do we need to add?

A

a selector

<style>

html {
   background: red;

html = selector
</style>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Where do you add a selector in internal CSS?

A

a selector comes before a set of curly brackets

<style>

html {
   background: red;

html = selector
</style>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What’s the difference between External and Inline/Internal?

A

External CSS sits in a completely different file with a .css extension

17
Q

When should you use External CSS?

A

For multi-page websites

18
Q

How do you link up a CSS with our index.html (External)? 3 steps

A
  1. In the head section, add a self-closing <link></link> element
  2. Add the relationship
  3. Add the href

<head>
<link></link>
</head>

19
Q

What does the relationship stand for in External linking?

A

what is the role of the thing we’re linking to

rel=”stylesheet”

20
Q

What does href stand for in External linking?

A

where is it located?

href=”./styles.css”

21
Q

You can create CSS rules by specifying 2 simple things?

A
  1. Property we want to change(colon)
  2. Specify the value we want to change the property to (after the colon)

background: blue;

22
Q

What is a CSS selector?

A

It selects the HTML to apply the rules in between the curly brackets

h1 {
color: blue;
}

h1 = selector

23
Q

What is an element selector? How does it work?

A

It targets ALL elements of a particular HTML tag (the simplest selector)

(all h2, all h3, all p, all a, etc)

h1 {
color: blue;
}

24
Q

What is a class selector?

A

can be added as an attribute to any HTML element and groups those certain elements together to apply the same CSS rule to them all (useful for multi-page websites)

example:

<h2>Red</h2>

class –> the attribute added to the h2 HTML

25
Q

What does a class selector look like when targeting headings with the color red?

A

.red-heading {
color: red;
}

26
Q

A class selector applies CSS rules to specific elements with what attribute?

A

A class selector applies CSS rules to specific elements with the class attribute

Example:
.red-text {
color: red;
}

is applied to:

<h2>Red</h2>

27
Q

When using classes, they must be spelled how?

A

EXACTLY the same in all code lines

28
Q

Can different elements be grouped into the same class?

A

Yes

example:

h2 and p can be grouped into the same class

29
Q

What is an ID selector?

A

requires a # with no spaces between # and ID name for selector, should only be 1 ID with the specific name in the entire file

id=”main” attribute
#main { selector

30
Q

What are the different types of selectors? (5)

A
  1. Element
  2. Class
  3. ID
  4. Attribute
  5. Universal
31
Q

What special symbols do all the selectors use?

A

curly brackets { }

32
Q

What’s the difference between an ID selector and a class selector?

A

There should ony be 1 ID attribute/selector in the entire file with that specific name

33
Q

When we create an HTML tag, can we add as many attributes as we’d like?

A

Yes

(src, draggable, ID/class, href, etc)

34
Q

What is an attribute selector?

A

selects all elements with targeted attributes using brackets

p[draggable] {

35
Q

How do you change the order of a list item in an ordered list?

A

value=”3” or whatever order you want it to be

Complete Web Development - Udemy (9 decks)

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