function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Adhvika BalaAdhvika Bala 

Increase font size and make text bold in VF page

Can someone please advise what tags we can use in VF page for increasing font size of a particular text and make it bold,italic.

Thank you
VinayVinay (Salesforce Developers) 
Hi Bala,

Try below snippet.

<b><apex:outputText> XXXXX </apex:outputText> </b> 

<apex:outputText value="${0, number, ###,###,###,##0.00}" style="font-size:19px;">  
</apex:outputText>

Hope above information was helpful.

Please mark as Best Answer so that it can help others in the future.

Thanks,
Vinay Kumar
Adhvika BalaAdhvika Bala
I tried this one. I'm only trying to do this for questions part. however the answers should be in normal text

For example

Contact First Name:  Xyz
Contact Email : xyz@test.com

increasing the font size only for the questions part. The answers should be in normal text.

When i try this
<p><b><Style="font-size:30px:">Contact First Name:&nbsp;</style></b>apex:outputField value="{!Contact.First_Name__c}

But this doesn't seem to work.


 
Danish HodaDanish Hoda
Hi Adhvika,
Use style with different font-sizes and mention that as class in your input field as below:

<style>
.form_elem{
height: 15px;
font-size: 14px;
}
</style>

<p class="form_elem"><b>Contact First Name:&nbsp;</b>apex:outputField value="{!Contact.First_Name__c}
Adhvika BalaAdhvika Bala
I defined this as class and used the class like this.
But it takes the same font size(Style) for both the Question and answer.
If i use </p> in between the question and answer the answer(output value) goes to the next line.
<p class="form_elem"><b>Contact First Name:&nbsp;</b></p>apex:outputField value="{!Contact.First_Name__c}

If i remove the </p> the both the label and output values is displayed in the same style.
I'm trying to make the Label to be large and bold and outputvalue to be normal.

Please suggest
Danish HodaDanish Hoda
Hi Adhvika,,
To have both in the same line, use <span class="">{}</span>
Adhvika BalaAdhvika Bala
Tried this one. It doesn't seem to work.
<p class="form_elem">Contact First Name:&nbsp; </p><span class=""></span><apex:outputField value="{!contact.First_Name__c}" />