[jquery-ui]如何调整大小 jQuery 的 DatePicker 控制

标签: jQuery jQuery-UI
发布时间: 2011/5/26 14:12:41
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

我第一次使用 jQuery 的 DatePicker 控制。我知道了我的窗体上的工作,而是两次一样大,正如我所想的和 jQuery UI 页面上演示的约 1.5 倍大。是有一些简单的设置我缺少控制大小吗?

编辑:我找到了一条线索,但它开辟了新的问题。在 CSS 文件中,它指出该组件将扩展到父元素的字体大小根据。他们建议设置

body {font-size: 62.5%;}

使 1em = 10px。这样做使我好中小型的 datepicker,但显然它搅乱我的站点的其余部分 (目前,我有字体大小:.9em)。

我想我的文本框周围投掷 DIV 和设置字体大小,但它似乎忽略的。所以必须设法缩小 datepicker 通过更改其父级的字体,但如何不搞我的站点的其余部分的情况下做的吗?

解决方法 1:

您不必在 jquery ui css 文件 (它可以是混乱如果您更改默认的文件) 中更改它,它是不够,如果添加

div.ui-datepicker{
 font-size:10px;
}

在样式表中后的 ui 文件加载

div.ui datepicker 被需要用户界面构件后 ui datepicker 宣言 》 中提到的情况下

解决方法 2:

不能添加评论,这就是 — — 在接受 Keijro 的答案。我其实添加以下样式表而:

div.ui-datepicker {
font-size: 62.5%;

}

和它以及工作。这可能是 10px 的最好的绝对值。

解决方法 3:

我更改了 ui.theme.css 中的以下行:

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

自:

.ui-widget { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 12px; }

解决方法 4:

添加

div.ui-datepicker, .ui-datepicker td{
 font-size:10px;
}

在之后的 ui 文件加载一个样式表。这也将调整大小的日期的项目。

解决方法 5:

不可能!!这种方法在 FireFox 时无法正常工作。每当我做它,它的工作原理确定在 IE 中,但在 FireFox 3.6.15 datepicker 连接不到具有日历元素,但在页面的顶部。该元素是由 datepicker 重叠的。但如果页是"短"不总是发生 (具有日历元素和下面的 1-2 线)。

解决方法 6:

我想,我发现它 — — 我不得不进入 CSS 文件并直接更改为 datepicker 控件的字体大小。一旦你了解它,但第一次令人费解明显。

解决方法 7:

打开 ui.all.css

在结束付诸表决

@import "ui.base.css";
@import "ui.theme.css";

div.ui-datepicker {
font-size: 62.5%; 
}

和去 !

解决方法 8:

在你的 css 的列表中包括 demo.css

赞助商