0

我在 jquery mobile 中有一系列按钮，它们需要有自己的外观和感觉。我给了他们一个自定义类（例如，“custom_btn”）。它们位于特定页面的页脚中。我可以使用更改文本大小

#thisPage .ui-footer .ui-btn-text {
    font-size: 36px;
}

问题是我不希望这影响页脚中的所有按钮，而只影响具有 .custom_btn 类的按钮。我尝试了以下方法，但均无济于事：

.ui-footer .custom_btn.ui-btn-text
.ui-footer .custom_btn .ui-btn-text
.ui-footer .ui-btn-text .custom_btn
.ui-footer .ui-btn-text.custom_btn
.ui-footer .custom_btn.ui-btn-inner .ui-btn-text
.ui-footer .custom_btn .ui-btn-inner .ui-btn-text
.ui-footer .custom_btn-button .ui-btn-text
.ui-footer button.custom_btn .ui-btn-text
.ui-footer button .custom_btn .ui-btn-text

在查看网络检查器时，该类似乎处于按钮级别，因此应该是 .ui-btn-text 的祖先和 .ui-btn 的子级。但是，每当我将 .custom_btn 类放在代码中时，样式都会中断。如何为这些按钮提供自定义样式？

编辑：这是我用来生成按钮的代码，标记为 1-9（忽略按钮标签前面的额外空格。它可以让标签出现在这篇文章中）。

    < button data-role="button" class="construct_answer" data-inline="true" value=1>1</button>;
    < button data-role="button" class="construct_answer" data-inline="true" value=2>2</button>;
    < button data-role="button" class="construct_answer" data-inline="true" value=3>3</button>;
    < button data-role="button" class="construct_answer" data-inline="true" value=4>4</button>;
    < button data-role="button" class="construct_answer" data-inline="true" value=5>5</button>;
    < button data-role="button" class="construct_answer" data-inline="true" value=6>6</button>;

在一个外部 .js 文件中，我有这个代码

$(document).bind('pagecreate',function(e){
    if (e.target.id == 'assessment') {
        $('.consruct_answer').prev().css({'font-size':'30px'});
    }
}

奇怪的是，当我将此代码包含在“内容”部分中时，我可以使用 Phil 提供的解决方案来设置按钮的样式，而不会出现问题。但是，当页脚中有相同的代码时，我无法让它工作。任何线索为什么会这样？

4

0 回答 0