Styling different paragraphs with different styles using CSS and HTML

问题

I have a question on using the class tag on paragraph tags. I want the external Css file to style a paragraph a certain way while leaving all the other paragraphs to the default style.I did some googling and reading and found if i add <p class="somename" > then in the css file i can change that paragraph using p.somename{ color: blue;} But what i found is p{color: red;} seems to be affecting them all.

This was just a example problem. The main problem im facing is that i dont want p.somename to have a background border.And the default <p> has borders.

回答1:

In HTML,

<p id="colorblue">some lorem ipsum here</p>

In CSS,

 p #colorblue{
color: blue
}

Or tepkenvannkorn's answer will work.

p.somename { color: blue !important; }

回答2:

Put p.somename{ color: blue } to the bottom comparing to p{ color: red} or you can use !important to foce your style to overwrite. for example,

p.somename {
   color: blue !important;
}

回答3:

Only use that id on the paragraph that you want to change, while keeping others at default

    p #colorred{
    color:red
    }
    <p id="colorred">

回答4:

/* In HTML,

<p id="colorblue">some lorem ipsum here</p>

In CSS,

#colorblue {
 color:blue;
}

This works. You do not need to explain that is a paragraph in CSS. Only write the ID of the paragraph in CSS.*/

来源：https://stackoverflow.com/questions/17266501/styling-different-paragraphs-with-different-styles-using-css-and-html

标签

html

css

html5

class

styles