CODEWITHSUNDEEP
cssaddition
Nurik kom
Nurik kom

Reputation: 21

Is it possible to add css to specific section of a page?

hi I want to add css in title sections in my page

I have a different sections in 1 page

but I want to change in each section fonts and color of title text

but not sure about how to do that

enter image description here

Upvotes: 0

Views: 8515

Answers (3)

Sensoray
Sensoray

Reputation: 2420

Give each section a class, and then apply the stylings to the children of that class. For example:

.section-1 h2{
  color:#fff;
}
.section-1{
  background-color:orange;
}
.section-1 p{
  color:blue;
}
.section-2 h2{
  color:#fff;
}
.section-2{
  background-color:peachpuff;
}
.section-2 p{
  color:black;
}
.section-3 h2{
  color:#fff;
}
.section-3{
  background-color:pink;
}
.section-3 p{
  color:purple;
}
<html>
<head></head>
<body>
<div class="section-1">
   <h2>Section 1</h2>
   <p>Filler paragraph text</p>
</div>
<div class="section-2">
   <h2>Section 2</h2>
   <p>Filler paragraph text</p>
</div>

<div class="section-3">
   <h2>Section 3</h2>
   <p>Filler paragraph text</p>
</div>

<div class="section-4">
   <h2>Section 4</h2>
   <p>Filler paragraph text</p>
</div>

</body>
</html>

Upvotes: 3

Phillip Bussart
Phillip Bussart

Reputation: 11

You can make separate css options via Id attribute.

Check out https://www.w3schools.com/html/html_css.asp. "The id Attribute"

Upvotes: 1

Austin Poole
Austin Poole

Reputation: 785

You can use the style attribute https://www.w3schools.com/tags/att_style.asp

<h1 style="color:blue;text-align:center">This is a header</h1>
<p style="color:green">This is a paragraph.</p>

Upvotes: 0

Related Questions