2015-05-10 40 views
0

如何增加字體和編輯免費jqgrid中的元素大小編輯並添加表單,以便它們具有與引導程序中相同的大小。 Twitter的引導允許創建使用形式的基團和形狀控制類hightligh像如何增加字體大小和元素高度如果免費jqgrid表格編輯

<div class="form-group"> 
<label for="Kellaaeg">Kell</label> 
<input class="form-control" id="Kellaaeg" name="Kellaaeg"> 
</div> 

但遊離的jqGrid不所以使用不支持這些類與有源元件好的編輯的元素。

我根據 How to make element sizes to fill cell sizes and increase font in free jqgrid inline and form editing

.jqgrow > td input[type=text].editable, 
.jqgrow > td input[type=date].editable, 
.jqgrow > td input, 
.jqgrow > td textarea { 
    height: 100%; 
    width: 100%; 
    font-size: 1em; 
    box-sizing: border-box; 
} 

.jqgrow > td select.editable, 
.jqgrow > td select { 
    width: 100%; 
    font-size: 1em; 
    box-sizing: border-box; 
} 

嘗試,但這種改變只是聯編輯。表單元素仍然很小。 如何編輯,添加,查看錶單元素也與自舉中的大小相同?

回答

1

嘗試使用

.ui-jqgrid .ui-jqdialog { 
    font-size: 16px; 
} 

增加/改變編輯對話框(和其它對話框的主體的字體大小jqGrid的)。

如果你想不改變對話框形式的按鍵的字體和需要設置的字體僅與編輯形式對話框頂部帕託,那麼你可以使用下面的選擇,而不是

.ui-jqgrid .ui-jqdialog .FormGrid { 
    font-size: 16px; 
} 

要更改標題欄的字體,可以使用CSS選擇器.ui-jqdialog .ui-jqdialog-titlebar

+0

謝謝。有效。在標題關閉按鈕和標題垂直對齊是由幾個像素混亂。像其他答案一樣使用'font-size:1rem'會更好嗎? – Andrus

+0

@安德魯斯:不客氣! 「16px」的例子只是爲了非常清楚地看到這些變化的工作。 – Oleg

0

引導設置根元素的字體大小,以便可以使用rem CSS單元,其指的是根元素的字體大小

.jqgrow > td input[type=text].editable, 
.jqgrow > td input[type=date].editable, 
.jqgrow > td input, 
.jqgrow > td textarea { 
    height: 100%; 
    width: 100%; 
    font-size: 1rem; /* 1rem instead of 1em */ 
    box-sizing: border-box; 
} 

.jqgrow > td select.editable, 
.jqgrow > td select { 
    width: 100%; 
    font-size: 1rem; /* 1rem instead of 1em */ 
    box-sizing: border-box; 
} 

否則自舉的根字體大小是14px

+0

這不會改變免費的jqgrid編輯winow字體。其他一些選擇器,不需要應用 – Andrus

相關問題