Ion-view customize view-title ionic framework


#1

I want to customize the view-title of an ion-view so that the title appears 4 letters in red and 4 letters in white. How do I do this?

For example I use a template like this:

ion-view view-title=“HelloWorld”

Now I want that Hello appears in red color and world in white color.

My main problem is that I can’t get an access via css to the view-title.


#2

You can use ionNavTitle and wrap part of the title in a span:

<ion-nav-title>
    <span class="red">Hello</span>World
</ion-nav-title>

#3

Oh thanks that works. I’m using the side menu template so I thought I have to do it the way with the view-title.


#4

Nope. :smile: As long as ion-nav-title is a child of ion-view or ion-nav-bar it will work.