2016-05-25 4 views
2

Я пытаюсь найти значок FontAwesome внутри p: commandButton и p: menuitem.Изменить размер шрифта FontAvesome в простых шрифтах (p: commandButton и p: menuitem)

Я могу отображать значки, однако по сравнению со встроенными значками для мобильных устройств значки FontAwesome кажутся слишком маленькими. Это выглядит непоследовательно, если у вас есть другие компоненты PF, используя значки themeroller.

Есть ли способ увеличить размер значков FontAwesome?

, и я также стараюсь в стиле увеличить размер шрифта и fa-lg, fa-2x, fa-3x, fa-4x или fa-5x, но не работает.

<p:commandButton icon="ui-icon-mobile-phone" id="sendSMSBtn" 
    styleClass="btn btn-info btn-lg" onclick="modalDialog.show()" 
    oncomplete="modalDialog.hide();" 
    action="#{myBean.getMobileNo()}" 
    update=":frm:messages" style="font-size:30px"> 

Сгенерированный HTML:

<button type="submit" title="Send Bulk SMS" onclick="modalDialog.show();PrimeFaces.ab({source:'frm:dataTable:sendSMSBtn',update:'frmMassSMS frm:messages',oncomplete:function(xhr,status,args){modalDialog.hide();;}});return false;" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only btn btn-info btn-lg fa-fw" name="frm:dataTable:sendSMSBtn" id="frm:dataTable:sendSMSBtn" role="button" aria-disabled="false"><span class="ui-button-icon-left ui-icon ui-c ui-icon-mobile-phone"></span><span class="ui-button-text ui-c">ui-button</span></button> 
+0

Вы можете сделать это с размером шрифта. вероятно, попробуйте с размером шрифта: 2em и т. д. – chanaka777

+0

@ chanaka777 Я пытался, но он не работает –

+0

был бы полезен, если вы можете вставить HTML-рендеринг источника – chanaka777

ответ

-3

Да, вы можете!

Но если вы хотите использовать FA, вы должны добавить ссылку на библиотеку. У меня была такая же проблема, и я сделал это:

<!-- CSS With Font-Awesome.jar --> 
     <link href="/webjars/font-awesome/4.6.3/css/font-awesome.css" rel="stylesheet" type="text/css" media="screen"/> 

Некоторый код:

    <td > 
         <i class="fa fa-camera-retro"></i> fa-camera-retro    
         <i class="fa fa-camera-retro fa-lg"></i> fa-lg 
         <i class="fa fa-camera-retro fa-2x"></i> fa-2x 
         <i class="fa fa-camera-retro fa-3x"></i> fa-3x 
         <i class="fa fa-camera-retro fa-4x"></i> fa-4x 
         <i class="fa fa-camera-retro fa-5x"></i> fa-5x 
        </td> 

Вы должны добавить тоже на web.xml этот фрагмент:

<context-param> 
    <param-name>primefaces.FONT_AWESOME</param-name> 
    <param-value>true</param-value> 
</context-param> 

Удачи!

+0

, пожалуйста, отзывы –

+0

FA работает, значки только для маленьких ... – Kukeltje

+0

все решения нашли? –

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

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