Question

我正在尝试测试jQuery日历工具，但它appears to be too big，大于preview page。

有什么想法吗？

谢谢！

Answer 1

在css文件中更改字体大小，例如我的css文件恰好是

/css/smoothness/jquery-ui-1.8.1.custom.css

我改变了

.ui-widget {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1.1em;
}

到

.ui-widget {
    font-family: Verdana,Arial,sans-serif;
    font-size: 0.7em;
}

Answer 2

我遇到了同样的问题。我不得不将自定义CSS中的字体大小更改为1.25em以外的其他字体。我相信我使用的是小号，因为我在我的应用程序的其他地方使用过。

在FireFox中浏览页面时，我能够检查FireBug中的整个日历控件，并将字体大小更改为中等（我认为，可能很小），并在此时完美呈现。刚进入UI CSS并永久更改它，并且没有投诉。

查看my post here ...

Answer 3

或者只是添加此css行：

#ui-datepicker-div {
    font-size:12px !important;
}

Answer 4

您可以使用Firebug's Inspect feature选择其中一个值，您将看到哪些样式表设置了字体的大小。然后你可以改变它以满足你的需要。

Answer 5

这与jquery正在使用的css样式有关（这与其他人对css的回答有关），尤其是与px相比的em中的字体大小 - 我认为它试图继承样式从页面本身，或类似的东西。

对我来说，解决方案是将ui-widget css类的font-size更改为11px，从而产生以下css类：

.ui-widget {
-x-system-font:none;
font-family:Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
**font-size:11px;**
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
line-height:normal;
}

Answer 6

你有没有调整字体大小的特定CSS？这将调整任何jQuery字体大小。

Answer 7

样式表极有可能控制它。查看网页的来源，可以是this one或this one。

正如您所看到的，它们非常丑陋，但您可以通过像this one这样的美化术来运行它。

或者您可以简单地下载其中包含亮度主题的JQuery UI版本。我的猜测是它已经有了正确的尺寸。

Answer 8

仔细检查您是否使用了演示站点正在使用的相同jQueryUI主题。我通过在我的网站上加载了错误的主题看到了这个确切的问题。

Answer 9

只需添加你的css行：

.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; }
font-size: 0.7em;

像这样：

.ui-datepicker { width: 17em; font-size: 0.7em; padding: .2em .2em 0; display: none; }

Answer 10

我遇到了类似的问题。我通过使用chrome的开发人员工具检查元素来解决它，并意识到包含datepicker的div元素（即id为ui-datepicker-div的div）被附加到body元素。 datepicker div将font-size css属性设置为1.1em（来自jQuery UI的基本css文件中的类ui-widget）。由于我没有在body元素（即包含datepicker的元素）上设置字体大小，因此根据this blog默认使用16px。在body元素上设置显式font-size为我解决了问题。

jQuery Date Picker比预览站点大

10 个答案: