javascript Handsontable - 更改行高
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19969208/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Handsontable - Change row height
提问by Tomás Escamez
I want to change the height of the rows in mi handsontable. I already change the widht of the columns (colWidths: [75,75,75]), but i cant find the way to do the same with rows.
我想更改 mi handsontable 中行的高度。我已经更改了列的宽度(colWidths:[75,75,75]),但我找不到对行执行相同操作的方法。
Thanks!
谢谢!
回答by DanTe
you can use this. but remember you must mark the "white-space:nowrap " as !important to override the handsontable property
你可以用这个。但请记住,您必须将“white-space:nowrap”标记为 !important 以覆盖 handsontable 属性
.handsontable td, .handsontable tr, .handsontable th
{
max-width: 20px;
min-width: 10px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap !important;
}
回答by Edgar Chavolla
I had the same issue, and you need to modify in one place, the css file, or you can overwrite the style in your html:
我遇到了同样的问题,您需要在一个地方修改 css 文件,或者您可以覆盖 html 中的样式:
in the handsontable css file search for the style .handsontable td :
在 handsontable css 文件中搜索样式 .handsontable td :
.handsontable td {
border-right: 1px solid #CCC;
border-bottom: 1px solid #CCC;
height: 22px; /*change to the desired height value*/
empty-cells: show;
line-height: 21px;
padding: 0 4px 0 4px;
/* top, bottom padding different than 0 is handled poorly by FF with HTML5 doctype */
background-color: #FFF;
vertical-align: top;
overflow: hidden;
outline-width: 0;
white-space: pre-line;
/* preserve new line character in cell */
}
Just change the "height" value to the one you want inside the css, or you just add the following line in the style section of your html document:
只需将“高度”值更改为您想要在 css 中的值,或者您只需在 html 文档的样式部分添加以下行:
.handsontable td { height: <desired height>px;}
Additionally I would make the changes mentioned by RustyBadRobot in file jquery.handsontable.js, this could be used in some other calculation, but so far the change in css seems to be enough.
此外,我会在文件 jquery.handsontable.js 中进行 RustyBadRobot 提到的更改,这可以用于其他一些计算,但到目前为止,css 中的更改似乎已经足够了。
Please note that this is working with handsontable version 0.11.3, not sure if this is also true for other versions.
请注意,这适用于可手持版本 0.11.3,不确定其他版本是否也适用。
回答by RustyBadRobot
The problem with that Chachi-inactive is the height gets dynamically set on one of the holder divs
Chachi-inactive 的问题是高度在其中一个持有人 div 上动态设置
<div class="wtHolder ht_master" style="position: relative; height: 27px;">
You can find and edit the below code in the main handsontable.js
您可以在主 handsontable.js 中找到并编辑以下代码
columnWidth: 50,
rowHeight: function (row) {
return 50;
},
defaultRowHeight: 50,
selections: null,
hideBorderOnMouseDownOver: false,
This needs to be updated if you have elements below the handsontable table.
如果您在手持表格下方有元素,则需要更新。
回答by artburkart
I don't know of any parameter similar to colWidths
that you can use to specify individual row heights, but you can use CSS to specify a height for all td and th elements.
我不知道有任何类似于colWidths
您可以用来指定单个行高的参数,但您可以使用 CSS 为所有 td 和 th 元素指定高度。
For example:
对于例如:
.handsontable th,
.handsontable td {
line-height: 50px;
}