-2

most modern sites have what I'm looking for. I want to be able to change the background of different areas of my site... like this for example: https://adwords.google.com/intl/en_uk/home/ Googles page goes from blue, to white to a different shade of white.

How do I do this?

Thanks in advance

Matt1966
  • 27
  • 1
  • 5
  • Is the CSS [`background-color`](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color) property what you're looking for? – Jonathan Lam Oct 13 '17 at 16:25
  • background-color does the whole background I think. I want different parts to have different colours - like the URL above :-) – Matt1966 Oct 13 '17 at 16:28
  • Possible duplicate https://stackoverflow.com/questions/8704817/how-to-style-a-div-to-have-a-background-color-for-the-entire-width-of-the-conten – TidyDev Oct 13 '17 at 16:28
  • 2
    Possible duplicate of [How to style a div to have a background color for the entire width of the content, and not just for the width of the display?](https://stackoverflow.com/questions/8704817/how-to-style-a-div-to-have-a-background-color-for-the-entire-width-of-the-conten) – TidyDev Oct 13 '17 at 16:28
  • @Matt1966 Create multiple elements and style the background color of each of them separately. – Jonathan Lam Oct 13 '17 at 16:31

1 Answers1

1

What they do is create different sections, and set a different background-color per section.

div {
    width: 100%;
    height: 150px;
}
#section1 {
    background-color: red;
}
#section2 {
    background-color: blue;
}
#section3 {
    background-color: yellow;
}
<div id="section1">Content for section 1</div>
<div id="section2">Content for section 2</div>
<div id="section3">Content for section 3</div>
Jared Bledsoe
  • 559
  • 5
  • 15