在jQuery的移動更改列表視圖項背景顏色

我一直想弄清楚如何更改位於頁腳「家」下面的列表視圖項目中的背景顏色。我知道這應該是一個簡單的例子，但我沒有嘗試過。這是我的代碼，我做錯了什麼。在jQuery的移動更改列表視圖項背景顏色

<html> 

    <head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.css"> 
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.js"></script> 
    </head> 

    <style> 
    .ui-page { 
     background:#C2C2A3; 
    } 
    .ui-page .ui-header { 
     background: #2F4F4F !important; 
    } 
    .ui-page .ui-footer { 
     background: #2F4F4F !important; 
    } 
    h1 { 
     color: #FFFFFF; 
     text-shadow: 2px 2px #B2C2D1; 
    } 
    .ui-icon-myicon:after { 
     background-image: url("img/phone_icon_small.png"); 
    } 
    #footer_color li { 
     background-color: #2F4F4F; 
    } 

    #footer_color li.current { 
     background-color: #2F4F4F ; 
    } 

</style> 

<!-- BODY --> 
<body> 
    <!-- PAGE --> 
    <div data-role="page" id="contacts"> 
     <!-- HEADER --> 
     <div data-role="header"><h1>CONTACTS</h1></div> 
     <!-- END HEADER --> 

     <!-- CONTENT --> 
     <div data-role="main" class="ui-content"> 
      <ul data-role="listview" data-inset="true"> 
       <li data-icon="myicon"> 
        <a href="#myPopup1" data-rel="popup" class="ui-content" data-transition="flip" data-position-to="window"> 
         <img src="http://lorempixel.com/80/40/technics/1/"> 
         <h2>Contact 1</h2> 
         <p>Phone: 000-123-4567</p> 
        </a> 
        <a href="tel: 000-123-4567"></a> 
        <div data-role="popup" id="myPopup1"> 
         <p class ="popup_text">Please call this number for company information</p> 
        </div> 
       </li> 

      </ul> 
     </div> 
     <!-- END CONTENT --> 

     <!-- FOOTER --> 
     <div data-role="footer"> 
      <div data-role="navbar" data-iconpos="top"> 
       <ul id="footer_color"> 
        <li class="current"> 
         <a href="#home" data-transition="slideup" data-theme="" data-icon="home">Home</a> 
        </li> 
       </ul> 
      </div> 
     </div> 
     <!-- END FOOTER --> 
    </div> 
    <!-- END PAGE --> 
</body> 
<!-- END BODY -->

來源

2014-10-19 speedracer2003

應使用以下CSS來改變footer區域的背景色：

#footer_color li.current a { 
    background-color: #2F4F4F; 
}

這裏有一個DEMO。

來源

2014-10-19 02:31:06

非常感謝=） – speedracer2003 2014-10-19 02:43:32

在jQuery的移動更改列表視圖項背景顏色

回答

相關問題