簡體   English   中英

Kendo-ui應用程序抽屜CSS配置

[英]Kendo-ui app drawer css config

我對移動編程很陌生,並且在kendo-ui中發現了CSS的一些問題。

應用抽屜菜單

1-如何消除可折疊菜單1周圍的灰色邊框? 2-我無法在每個部分上將邊框都設置為0 ... 3-在第9部分下方,是一個較寬的灰色區域...無法將其設置為與整個菜單相同的深灰色。

下面的代碼:

 <div data-role="drawer" id="app-drawer" class="drawer-menu"> <div data-role=header> <div data-role="content" class="drawer-profile"> <a href="views/profile.html" data-role="button" style="color: yellow; horizontal-align: middle">edit</a> </div> </div> <ul data-role="listview" class="drawer-menu"> <li class="drawer-li drawer-menu"> <div data-role="collapsible" class="drawer-collapsible drawer-menu km-icon-right"> <h3 style="font-weight: normal" class="drawer-menu">1...</h3> <ul data-role="listview" data-inset="false"> <li class="drawer-menu"><a href="views/nearme.html?##Search=nearme">11</a></li> <li class="drawer-menu"><a href="views/nearme.html?##Search=address">12</a></li> <li class="drawer-menu"><a href="views/categorylist.html">13</a></li> <li class="drawer-menu"><a href="#">Serviços on-line</a></li> </ul> </div> </li> <li class="drawer-menu"><a href="views/promolist.html">2</a></li> <li class="drawer-menu"><a href="#">3</a></li> <li class="drawer-menu"><a href="#">4</a></li> <li class="drawer-menu"><a href="#">5</a></li> <li class="drawer-menu"><a href="#">6</a></li> <li class="drawer-menu"><a href="#">7</a></li> <li class="drawer-menu"><a href="#">8</a></li> <li class="drawer-menu"><a href="#">9</a></li> </ul> </div> 

 .drawer-li { padding: 0 !important; border-width: 0 !important; } .drawer-collapsible { margin: 0 !important; border-bottom-right-radius: 0 !important; border-bottom-left-radius: 0 !important; border-width: 0 !important; } .drawer-collapsible h3 a { border-radius: 0 !important; border-width: 0 !important; border-bottom-width: 0 !important; } .drawer-profile { background: #34393D; height: 90px; /* opacity: 0.5; */ font: Segoe !important; border-width: 0px !important; } .drawer-menu { background: #34393D !important; color: white; font: Segoe !important; border-width: 0px !important; 

沒有人回答這個問題,但是我可以自己解決。 我將發布解決方案只是為了幫助任何有相同疑問的人。

 .drawer-menu li { background: #34393D !important; color: white; font: Segoe !important; font-size: 14px; border-width: 0px !important; } .drawer-menu div { background: #34393D !important; color: white; font: Segoe !important; font-size: 14px; border-width: 0px !important; padding-left: 5px; padding-right: 5px; } 

為,和都配置類無效。 因此,我為孩子設置了CSS,並在為應用程序抽屜歸類的類“ .drawer-menu”內設置了CSS。 圖像中的結果: 抽屜式菜單已解決

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM