How do you distinguish between paragraphs <p> in the html when editing in css? like if I wanted to have different images behind different paragraphs, would you use the class ""? know it's basic, but I can't think through all the new stuff I've learnt lol thanks!

Question

hi everyone, new to coding after working in an IT company on customer service and getting interested in the "back end". This course is great. I have a question (think it's been covered but can't wrack my brain for the answer)

Answer 1

Yes you can use class (I prefer ID). If you want to set picture "x.png" to paragraph 1 and picture "y.png" to paragraph 2 as the background you have to give each paragraph a different class/ID (in your HTML area of course):
<p class="one">this is paragraph one</p>
and
<p class="two">this is paragraph two</p>
Now you can set the different backgrounds in CSS:
p.one:{ background-image:url(x.png); }
and
p.two:{ background-image:url(y.png); }

Hope it helped! :)

Answer 2

Use ID to target unique elements. Usually, classes are more common, you will see and use them often.

Answer 3

I've made a little mistake: don't write p.one:{} but p.one {}

Answer 4

add a class to p
write like this in html
<p class="my">

write like this in css
p.my {background:url(#####) no-repeat;}
add image url in the place of '#'

Answer 5

use selectors https://www.w3.org/TR/CSS21/selector.html%23id-selectors

Answer 6

you can distinguish between any element using a class
use <p class="name"> in html
and use p.name in css