调整JQuery DateTimePicker尺寸遇阻：自定义CSS未生效求助

DevOps 小满

2026-8-24

调整jQuery DateTimePicker尺寸的解决方案

问题根源

你使用的.ui-datetimepicker选择器可能优先级不足，或者插件内部元素未继承容器样式，导致尺寸调整失效。

可行解决办法

提升选择器优先级
给选择器添加更具体的上下文，比如若DateTimePicker绑定在#date-input输入框上，可这样写：
```
#date-input + .ui-datetimepicker {
  font-size: 16px; /* 替换为你需要的尺寸 */
  border: 1px solid #555;
}
```
也可临时用!important强制覆盖（不推荐长期使用，避免样式冲突）：
```
.ui-datetimepicker {
  font-size: 16px !important;
  border: 1px solid #555 !important;
}
```

直接设置内部元素样式
多数DateTimePicker插件的内部元素（日期单元格、表头文字、时间输入框等）不会自动继承容器字体大小，需单独指定：

/* 调整整体容器 */
.ui-datetimepicker {
  font-size: 16px;
  border: 1px solid #555;
}
/* 调整日期单元格文字与点击区域 */
.ui-datetimepicker td a {
  font-size: inherit;
  padding: 8px; /* 调整内边距改变单元格大小 */
}
/* 调整表头标题 */
.ui-datetimepicker .ui-datepicker-title {
  font-size: inherit;
}
/* 调整时间选择器输入框 */
.ui-datetimepicker .ui-timepicker-input {
  font-size: inherit;
}