Hi Amanda,
Q1.How can I add an ID to each TabItem of the component
so that I can change its style separately?
You can add the ID
property and set its value in string in the TabItem tag like the below
code snippet.
Q2.Can I add custom icons at the tab header of each
TabItem and how?
Yes, you can add the custom icons at the tab header using
the IconCss
property. In the below example, we have used the font awesome icon with the Tab
header.
[_Host.cshtml]
[Index.razor]
<TabItem ID="Tab1" Content="Twitter
is an online social networking service that enables users to send and read
short 140-charactermessages called tweets. Registered users can read and post
tweets, but those who are unregistered can only read them. Users access
Twitter through the website interface, SMS or mobile device app Twitter Inc.
is based in San Francisco and has more than 25 offices around the world.
Twitter was created in March 2006 by Jack Dorsey, Evan Williams, Biz Stone,
and Noah Glass and launched in July 2006. The service rapidly gained
worldwide popularity, with more than 100 million users posting 340 million
tweets a day in 2012.The service also handled 1.6 billion search queries per
day.">
<ChildContent>
<TabHeader Text="Twitter" IconCss="fa
fa-twitter"></TabHeader>
</ChildContent>
</TabItem>
|
Output:
Regards,
Ruksar Moosa Sait
Attachment:
BlazorTabCustomIcon_2e929018.zip