We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How can I change the font family ?

Thread ID:

Created:

Updated:

Platform:

Replies:

132398 Aug 30,2017 02:09 PM UTC Aug 31,2017 05:02 AM UTC JavaScript 1
loading
Tags: ejTab
tomer
Asked On August 30, 2017 02:09 PM UTC

Hi,
How can I set the font family of a tab control?

I tried the following code without success:

<style>
    .tabFont { font-family: "Arial"; }
</style>

<ej:Tab ID="Tab1" runat="server" CssClass="tabFont">
    <Items>
        <ej:TabItem ID="TabItem1" Text="tab_1">
            <ContentSection>
                <asp:Label ID="lbl1" runat="server" Text="txt1" />
            </ContentSection>
        </ej:TabItem>
        <ej:TabItem ID="TabItem2" Text="tab_2">
            <ContentSection>
                <asp:Label ID="lbl2" runat="server" Text="txt2" />
            </ContentSection>
        </ej:TabItem>
    </Items>
</ej:Tab>

Thanks,
  Tomer

Keerthana Rajendran [Syncfusion]
Replied On August 31, 2017 05:02 AM UTC

Hi Tomer,   
 
Thank you for contacting Syncfusion support. 
 
We can apply required styles by using cssClass name along with class name through which styles are added. Please refer to the below given code 
 
<ej:Tab ID="Tab1" runat="server" CssClass="tabFont"> 
    <Items> 
        <ej:TabItem ID="TabItem1" Text="tab_1"> 
            <ContentSection> 
                <asp:Label ID="lbl1" runat="server" Text="txt1" /> 
            </ContentSection> 
        </ej:TabItem> 
        <ej:TabItem ID="TabItem2" Text="tab_2"> 
            <ContentSection> 
                <asp:Label ID="lbl2" runat="server" Text="txt2" /> 
            </ContentSection> 
        </ej:TabItem> 
    </Items> 
</ej:Tab> 
<style> 
    .tabFont.e-tab.e-js 
    { 
        font-family:Arial;  
    } 
</style> 
 
In tab control , font-family style will be applied to the class .e-tab.e-js . We can override this style by using an additional css class name. We have attached sample for your reference. Please download the sample from 
 

Regards,
 
Keerthana 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;