2013-09-25 55 views
0

我正在一个由其他人构建的WordPress网站上工作,目前我正在尝试对页脚进行样式设置并遇到一些问题。它只会在我直接选择html元素(footer [role = contentinfo] p {...})时起作用,因为它不会让我的样式在标签中选择任何div, ,甚至这是不稳定的。CSS页脚样式

任何人都可以提供一些指导?这里是页脚代码

<?php 
/** 
* The template for displaying the footer. 
* 
* Contains footer content and the closing of the 
* #main and #page div elements. 
* 
* @package WordPress 
* @subpackage Twenty_Twelve 
* @since Twenty Twelve 1.0 
*/ 
?> 
    </div><!-- #main .wrapper --> 
    <footer id="colophon" role="contentinfo"> 
     <div class="footer-links"> 
      <ul> 
       <li>About</li> 
       <li>About JoeStick</li> 
       <li>Our Products</li> 
       <li>FAQs</li> 
      </ul> 
     </div> 
     <div class="site-info"> 
      <p>YOU MUST BE OVER THE AGE OF 18 YEARS TO BUY AND OR USE ANY SOUTH BEACH SMOKE PRODUCT. Nicotine is a highly addictive 
      substance derived from the tobacco plant. Our products do not treat, diagnose, or cure any disease, physical ailment, or 
      condition. If you are allergic to nicotene or any combination or inhalents, if you are pregnant or breast-feeding, or if 
      you have a heart condition, diabetes, high blood pressure or asthma, consult your physician before using South Beach Smoke 
      nicotene products. Just like traditional tobacco cigarettes, South Beach Smoke Electronic Cegiarettes are not approved by 
      the American FDA.</p> 
     </div><!-- .site-info --> 
     <div class="footer-nav"> 
      <ol> 
       <li>Copyright &copy; 2013 SmokeSafely.com</li> 
       <li>Terms and Conditions</li> 
       <li>Warnings</li> 
       <li>Privacy Policy</li> 
       <li>Contact</li> 
      </ol> 
     </div> 
    </footer><!-- #colophon --> 
</div><!-- #page --> 

<?php wp_footer(); ?> 
</body> 
</html> 

,这里是我试图使用

/* Footer */ 
} 
footer[role="contentinfo"] { 
    background-color: #082448; 
    color: white; 
    border-top: 1px solid #ededed; 
    font-size: 12px; 
    line-height: 2; 
    margin-left: auto; 
    margin-right: auto; 
} 
footer[role="contentinfo"] a { 
    color: #686868; 
} 
footer[role="contentinfo"] a:hover { 
    color: #21759b; 
} 
footer[role="contentinfo"] ul { 
    width: 30%; 
    float: left; 
} 
footer[role="contentinfo"] p { 
    width: 65%; 
    height: 30%; 
    float: left; 
    font-size: 10px; 
} 
footer[role="contentinfo"] ol { 
    width: 100%; 
    height: 5%; 
    float: none; 
} 
footer[role="contentinfo"] ol li { 
    float: left; 
    display: inline; 
} 

目前我正在挣扎更主要的是在页脚无法正确显示背景色的CSS。再次,任何帮助非常感谢。

回答

0

与ID选择页脚标签:

#colophon {background-color:red;} 

...或任何你想让它更改为。

有时候WordPress的覆盖这些规则,所以我用(我知道,我相信这是可怕的做法,但它能够完成任务。)

#colophon {background-color:red !important;} 

然后抢文档的某些部分,你可以用child selector.

#colophon > div > ul > li {background-color:red;} 

我希望这有助于!