Градиент значка не работает на iOS

Я использую ionicons в своем приложении и хочу оформить их с помощью градиентов CSS. Код, который я нашел, отлично работает в браузере, но ничего не показывает в симуляторе/устройстве, просто пустое место. Вот что у меня есть в браузере: Печать браузера

мой HTML:

        <div class="spacer" style="width: 300px; height: 20px;"></div>
        <p style="font-size: 11px; margin-left: 10px; color: #a9a9a9;">PESSOAL</p>
        <ion-item class="item-icon-left" id="perfil-list-item21">
            <i class="icon ion-bag gradient-icon" style="font-size: 25px;"></i><p style="font-size: 15px; display:inline;">Aniversário</p>
            <span id="userbirth" class="item-note"></span>
        </ion-item>

CSS:

.gradient-icon {
  background-image: -webkit-gradient(linear, left top, left bottom,  from(#00e6e6), to(#0047b3));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: initial;}

Любая помощь будет приветствоваться.


ios ionic-framework html gradient css
person Fillipe Rodrigues    schedule 13.02.2017    source источник
comment
Вы проверили документацию: developer.apple. com/library/content/documentation/InternetWeb/   -  person    schedule 13.02.2017
comment
Да, у меня есть. Градиент работает с кнопками и другими элементами, но я не нашел способа заставить его работать с иконками...   -  person Fillipe Rodrigues    schedule 13.02.2017
comment
Я думаю, что ваша проблема заключается в том, что они описали в том ответе, который я связал: по крайней мере, в мобильном сафари вы не можете использовать ключевое слово «прозрачный», вместо этого вы должны использовать rgba (255 255 255,0).   -  person    schedule 13.02.2017