2015-05-10 4 views
0

Как увеличить размер шрифта и размеров элементов редактирования в бесплатном jqgrid редактировать и добавлять формы, чтобы они имели те же размеры, что и в бутстрапе. Twitter начальной загрузки позволяет создавать хорошие элементы редактирования с активным элементом hightligh с использованием форм-групп и форм-контрольные классы, какКак увеличить размер шрифта и высоту элемента, если свободен jqgrid form edit

<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).

Если вы хотите не изменить шрифт кнопок диалоговой формы и нужно установить шрифт только на верхних Пато диалог с Edit формы, то вы можете использовать следующий селектор вместо

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

Чтобы изменить шрифт строки заголовка, вы можете использовать, например, селектор CSS .ui-jqdialog .ui-jqdialog-titlebar.

+0

Спасибо. Это сработало. В кнопке закрытия заголовка и заголовке вертикальное выравнивание смешивается с несколькими пикселями. Лучше ли использовать «font-size: 1rem», как в другом ответе? – Andrus

+0

@ Andrus: Добро пожаловать! Пример с «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

это не изменит шрифт winq edit jqgrid. Необходимо использовать другой селектор, но не td – Andrus

 Смежные вопросы

  • Нет связанных вопросов^_^