1

我今天在为一个 Android 移动项目使用 Worklight 5.0.5 时遇到了一个问题。如果有帮助的话，这个项目确实使用了 Apache Cordova、Dojo Mobile 和 Worklight 库。

问题在于，Worklight 在某些情况下会在构建期间自动生成不需要的内联 CSS。我找不到 Worklight 的哪个组件对此负责，也找不到在需要时如何更改或防止此行为。这似乎是一个小问题，但事实上它是内联 CSS，并且在构建期间，意味着我无法影响它！

通过 JavaScript 和 CSS 进行搜索，无论是我构建的还是为 Dojo 导入的，似乎都没有显示任何会添加 CSS 的内容。

例子：

我的 HTML 中有以下标记：

<ul data-dojo-type="dojox.mobile.TabBar" barType="segmentedControl"
class="center segmentContainer">

构建后，这在基于 WebKit 的浏览器 (Google Chrome) 中显示为：

<ul bartype="segmentedControl" class="mblTabBarSegmentedControl mblTabBar center segmentContainer mblTabBarNoIcons"
data-dojo-type="dojox.mobile.TabBar" id="dojox_mobile_TabBar_0"
widgetid="dojox_mobile_TabBar_0" style="padding-left: 78px;">

最后的内联 CSS，“padding-left”，是我试图寻找和破坏的。有谁知道是什么导致了这种行为，以及我如何改变或防止它？

4

3 回答 3

1

您确定这个 Worklight 的构建过程添加了这种样式，而不是 Dojo 的解析？我会检查 Dojo 移动 api 以确保它没有默认添加。OOTB Dojo，用于 TabBar 使用内联 CSS 生成以下标记。

<ul id="demoTabBar" dojotype="dojox.mobile.TabBar" single="true" iconbase="images/tabbar_all.png" fixed="bottom" role="tablist" class="mblTabBarTabBar mblTabBar mblFixedBottomBar mblTabBarNoText mblTabBarFill" widgetid="demoTabBar" style="bottom: 0px; padding: 0px;">
于 2013-06-20T19:19:02.067 回答
1

这是默认的 Dojo 样式。您在 AppName.html 中编写此代码来覆盖它：

...
<style>
.segmentContainer {
    //your personalization
}
</style>
</head>
<body>
......
<ul data-dojo-type="dojox.mobile.TabBar" barType="segmentedControl"
class="segmentContainer">
于 2013-06-21T07:29:54.490 回答
1

我不太了解这些技术，但如果您无法摆脱插入的 CSS，您可以!important在自己的 CSS 中使用。例如：

.segmentContainer {
    padding-left: 0px !important;
}

这会优先考虑padding-left移出正常优先顺序的语句。通常我相信它是内联的，ids 然后是类，但!important你的类优先。

于 2013-06-20T16:37:53.983 回答