Kendo UI for jQuery数据管理使用教程:网格列宽

翻译|使用教程|编辑:龚雪|2020-03-26 09:26:21.250|阅读 15 次

概述:Kendo UI for jQuery是创建现代Web应用程序的最完整UI库。 要设置Grid列的宽度,请使用其width属性。

# 您正在找协同办公软件吗?点击这里站长给您推荐 #

相关链接:

Kendo UI for jQuery R1 2020 SP1试用版下载

Kendo UI目前最新提供Kendo UI for jQueryKendo UI for AngularKendo UI Support for ReactKendo UI Support for Vue四个控件。Kendo UI for jQuery是创建现代Web应用程序的最完整UI库。

要设置Grid列的宽度,请使用其width属性。

当您通过col元素从HTML表创建网格时,也可以设置列的宽度;但是,当对表单元格使用宽度样式时,请避免这种方法。

使用列宽和滚动

根据是否启用滚动,网格的列会获得不同的操作:

  • 默认情况下,在Kendo UI for jQuery,UI for JSP和PHP UI中为Grid启用了滚动。 启用滚动时:
    • table-layout样式设置为fixed,并且所有未定义宽度的列均显示为相同宽度。
    • 当水平空间不足时,没有定义宽度的列将缩小为零宽度。
    • 无论单元格内容如何,都应遵守定义的列宽。
    • 如果单元格的内容无法容纳,则网格将对其进行包装或修剪。
    • 在调整列大小的过程中,只有调整大小的列和table才会更改其宽度。
    • 调整列的大小或隐藏列时,网格将向其表元素应用像素宽度。 此操作有助于维持除当前已调整大小或隐藏的列之外的所有其余列的宽度。
    • 当所有列均具有像素宽度并且它们的总和超过网格的宽度时,将出现一个水平滚动条。
    • 当所有列均具有像素宽度并且其总和小于Grid的宽度时,将忽略列宽,并且浏览器将展开所有列。
  • 默认情况下,UI for ASP.NET MVC和UI for ASP.NET Core.中的网格禁用滚动。 禁用滚动时:
    • table-layout样式设置为auto,如果未明确定义,则列宽由浏览器和单元格内容确定,这是HTML表的默认操作。
    • 浏览器将尝试遵循所有设置的列宽,但可能会根据其内容来调整某些列的宽度。
常见情况

本节提供有关需要在Grid中实现列宽的常见方案信息。

使不可滚动网格服从列宽

将table-layout更改为fixed。

#GridID > table // Header and data table.
{
table-layout: fixed;
}

消除列和标题错位

要在调整网格大小时消除列和标题的不对齐,请提供至少一列没有指定宽度的列,以便它可以自由调整。


了解最新Kendo UI最新资讯,请关注Telerik中文网!

扫描关注慧聚IT微信公众号,及时获取最新动态及最新资讯

慧聚IT微信公众号


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果

文章转载自:慧都网

登录 慧都网发表评论


暂无评论...

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
title
相关厂商
相关产品
Kendo UI

全新升级的Kendo UI,是创建数据丰富的Web应用程序的最完整UI库。

Kendo UI for jQuery

创建现代Web应用程序的最完整UI库。

在线
客服
在线
QQ
咨询
电话
173-8239-2642
购物车 反馈 返回
顶部
在线客服系统
live chat