0

我在我的示例项目中使用 jQuery mobile。我有三个按钮。我正在更改按钮的样式（添加我自己的 CSS），以便它覆盖 jQuery 按钮 CSS。但是在添加时它仍然显示一些小的白色背景。我检查了页面，发现它是 jQuery 移动按钮。我无法覆盖该背景。这是我的尝试：http: //jsfiddle.net/naveennsit/5DDBD/

.ui-grid-c .ui-btn-inner {
    background: #2b6dbc; 
    color: #FFFFFF; 
    border: 1px solid #000; 
    border-radius: 3px; 
    width: 100px; 
    text-shadow: none; 
    margin-left: 4px; 
}

使用 DOM 检查器，当我删除background: 2b6dbc它时，它将显示 jQuery 移动按钮。

我怎样才能删除它？

添加后，它会改变焦点和非焦点的颜色。

.ui-btn-up-c{background:#2b6dbc; color:#FFFFFF; border:1px solid #000; border-radius:3px; width:100px; text-shadow:none; margin-left:4px;}
4

5 回答 5

1

ui-btn直接修改： http : //jsfiddle.net/5DDBD/5/

.ui-btn {
    background: #2B6DBC;
    text-shadow: none;
}

.ui-btn-inner {
    color:#FFFFFF;
}
于 2013-08-09T09:52:54.637 回答
0

您需要从 .ui-grid-c .ui-btn-inner 中删除 width 和 margin-left 属性。

于 2013-08-09T10:12:35.843 回答
0

将您的自定义 css 添加到 .ui-btn 而不是 .ui-btn-inner

.ui-grid-c .ui-btn
{
background:#2b6dbc; 
color:#FFFFFF; 
border:1px solid #000; 
border-radius:3px; 
width:100px; 
text-shadow:none;
margin-left:4px; 
}

见这里.. http://jsfiddle.net/5DDBD/2/

于 2013-08-09T09:49:07.387 回答
0

" .ui-grid-c > :nth-child(n)" 在 jquery.mobile-1.3.0-beta.1.css 上，您可以修复它：

.ui-grid-c > :nth-child(n){
/* width: 25% */
margin-right:5px;
border:none;
}

和“ .ui-grid-c .ui-btn-inner”删除margin-left:4px属性。

于 2013-08-09T09:49:14.827 回答
0

CSS 继承自“.ui-btn-up-c”类。它在您的“c”主题（data-theme = c）中定义。

因此，在 Theme Roller jquery Mobile 中定义自己的“c”主题的最佳方式。http://jqueryui.com/themeroller/

或者您可以从“.ui-btn-up-c”更改背景。

于 2013-08-09T09:32:41.160 回答