如何更改页脚背景颜色?

时间:2014-05-28 12:32:48

标签: background footer

我试图改变这个页脚背景颜色,但无济于事。如何更改此页脚的背景颜色?请具体,因为我不是一个聪明的人。我包含了一些不相关的CSS,但认为这是必要的。

<style type="text/css">
body {
font-family : Verdana, Helvetica, Geneva, SunSans-Regular, sans-serif, arial ;
background-color: #C2A366;
margin: 0 auto;
p.padding
{
padding-top:0px;
padding-bottom:0px;
padding-right:10px;
padding-left:0px;
}
table {
margin: 5px;
padding: 0;
}
}
#push{height:80px}

#footer{padding-top:0px; border-top:0px solid #dadada; width:960px; margin:0px auto 0;         height:0px; color:#4d4d4d;}

#footer p{font-size:1.2em; color:#4d4d4d; line-height:1.5em; margin-bottom:0; margin-top:0.6em}

.copyrightbar {
margin: 0 auto;
border-collapse: collapse;
border: 0px;
padding: 0px;
}
</style> 


<div class="push"></div>
</div> <!--Page Wrap-->
    <div id="footer">
   <table class="copyrightbar">
<tr><td><p class="padding"><font color="white">Phone: 555-555-1800<br>hello</p></font>        </td>
<td> <p> <font color="white"> Sample text<br></font>
</td></tr>
  </table><table> <br>
<?php bloginfo('name'); ?> <p align="center"><font color="white" font size="2">                 <i>Copyright &copy All Rights Reserved. </i> </font></p>
    <div class="push"></div>
<?php wp_footer(); ?>
</div>
</body></table>
</html>

4 个答案:

答案 0 :(得分:0)

您应该在background-color中使用#footer属性。

答案 1 :(得分:0)

请尝试在css或style中使用background-color属性。标记它!重要的是避免来自另一个相同属性的任何类型的冲突。

答案 2 :(得分:0)

您应该在CSS中的background-color:中使用;颜色#footer。 我已在您的CSS中应用了background-color:red;

以下是具有背景颜色的代码:http://jsfiddle.net/992fK/

但是,在这种情况下,您已将所有内容都放在<div id="footer">内,这就是为什么背景颜色应用于所有内容的原因。您可以安排您的内容,以便只有页脚内容会出现在页脚div中,然后根据您的要求应用颜色。

答案 3 :(得分:0)

您应该将HTML代码更正为以下

    <div class="push"></div>
    <!--Page Wrap-->
    <div id="footer">
    <table class="copyrightbar">
       <tr>
          <td>
            <p class="padding">
              <font color="white">Phone: 555-555-1800<br>hello</br>
              </font>
            </p>        
         </td>
         <td>
            <p>
              <font color="white"> 
                <br>Sample text</br>
              </font>
            </p>
         </td></tr>
    </table>

    <table> 
      <br/>
        <?php bloginfo('name'); ?>
        <p align="center">
           <font color="white" font size="2">
                 <i>Copyright &copy All Rights Reserved. </i>
           </font>
        </p>
        <div class="push"></div>
        <?php wp_footer(); ?>
    </table>

并在background-color:color; {@ 1}}中添加#footer,因为@Beauflitz说