在 Css 和 Html 中更改页脚背景的颜色

Question

This is the footer part code of my project

HTML Code:

<footer>
        <div class = "footer_container">
            <div class = "copyright">
                <h1>Urban Clothes | Copyright &copy; 2015-2020 </h1>
            </div>
        </div>
    </footer>

CSS Code:

.footer_container{
    background-color: white;
    height: 400px;
    border: 2px solid lightblue;
}

Body Code:

body{
    background-color: #24252A;
}

I am unable to change the background colour of my footer container. I changed the background colour of my body but the footer background colour is not changing.

Answer 1

       .footer_container {
        background: red;
        height: 400px;
        border: 2px solid lightblue;
    }

try to do shift refresh for the page ur working it will work, try with these code

Answer 2

Your code works for me. Maybe your browser has cached the style change your browser and try again or clear your web cache and then try again

Answer 3

You have a background-color: white; in your .footer_container , if you want for footer to have the color of body just don't give it a background-color: white; or you can give it background-color: transparent;

Answer 4

you can add !important, but it may affect other part of code if you have used same class name for other elements

.footer_container{
    background-color: white!important;
    height: 400px;
    border: 2px solid lightblue;
}