HTML & CSS CSS Labeling a <P>

[gothictrade]

In a previous question I wanted to learn to make a class so I had in my HTML document..

<button class="btn btn-1">button 1</button>

and then in my css file I did

btn {
// stuff
}

However... is it possible for me to do this with like.. a paragraph text? I want there to be a paragraph that I control its contents style/format via a css file.
For example..

Can I do something like

<p class="para1">text text text</p>

and then in the css file

para 1 {
    color: red;
}

Is that possible? I cant seem to get it to work though

 

[Malcolm]

Great question! So you have the idea of how to do it.

So remember that when you declare a class within HTML and you want to select it in CSS you must add a (.) in front of the class name. And you have a space between para and 1, should be para1.

The code would look similar to this:

<p class="para1">text text text</p>

.para1 {
    color: red;
}

When selecting a class in CSS you always add a dot (.) followed by the class name you specifed in HTML.
When selecting a ID in CSS you always add a dot (#) followed by the class name you specifed in HTML.

 

[gothictrade]

Great question! So you have the idea of how to do it.

So remember that when you declare a class within HTML and you want to select it in CSS you must add a (.) in front of the class name. And you have a space between para and 1, should be para1.

The code would look similar to this:

<p class="para1">text text text</p>

.para1 {
    color: red;
}

When selecting a class in CSS you always add a dot (.) followed by the class name you specifed in HTML.
When selecting a ID in CSS you always add a dot (#) followed by the class name you specifed in HTML.

Thank you so much! Im gonna try it out when I return home in a few hours

 

[Malcolm]

Thank you so much! Im gonna try it out when I return home in a few hours

You're welcome! I hope it helps!

 

[gothictrade]

You're welcome! I hope it helps!

Got it to work! Thank you so much

 

[Malcolm]

Got it to work! Thank you so much

Did you get it to work using the code I provided?

 

[gothictrade]

Did you get it to work using the code I provided?

Yes! Thank you~

 

[Malcolm]

Yes! Thank you~

Awesome! just make sure to mark the post as your solution!