Question

在网站上使用jQueryUI示例时（theme browser），事情看起来很棒。但是，当我将代码和主题放入我的应用程序时，大小调整是不合适的（我正在尝试使用Redmond主题）。

为什么这些样品看起来如此不同？在我构建的应用程序中，只有一个CSS引用用于Redmond主题......下面这些图像正是它们如何呈现给浏览器。

我的申请：
alt text http://www.imageunload.com/public/14462/jQueryUI.png

jQuery UI示例：
alt text http://www.imageunload.com/public/14463/jQueryUI-Sample.png

我的应用代码：

<div>
    <asp:TextBox ID="txtDateSample" runat="server"></asp:TextBox>
</div>
</form>
<script type="text/javascript" language="javascript">
    $(function() {
        $('#<%= txtDateSample.ClientID %>').datepicker({
            showButtonPanel: true,
            showOn: 'button',
            buttonImage: '../Graphics/Icons/calendar.png',
            buttonImageOnly: true
        });
    });
</script>

Firebug Div of Div：

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible"/>

Answer 1

这曾经发生在我身上。这是因为你的一些风格无意中影响了日历div。获取Firebug并查看正在应用于日历的样式。然后编辑主题以覆盖样式正在执行的任何操作。

修改

您要查找的部分不是HTML生成的，虽然这很重要，但更多的是实际应用的样式：

_{（来源：pathf.com）}

您将看到正在应用的样式，而已分配但未应用的样式将显示~~被删除~~。您可能会在此窗口中看到一些样式。他们很可能是罪魁祸首。通过使它们更具体来修复它们，你的日历应该很好。

Answer 2

当事情比你预期的要小时，一个好的假设就是某种百分比/比例尺寸递归发生，即你已经

.foo {width: 80%;}

某处已经应用了两次或更多，这意味着你的宽度最终达到80％80％的80％。

Answer 3

在index.php页面或主页或每个页面中添加此代码

<head>
<style>
    body{
        font-size: 62.5%; /* it is necessary for jquery ui */
        }
</style>
</head>

使用jquery-ui时管理字体或标签的大小是合法的编码程序。

jQuery-UI主题 - CSS大小差异

3 个答案: