2016-12-05 3 views
0

Ich mache immer noch ein Reponsive-Menü mit Scroll-Steuerelementen. Ich habe in meinem Menü einen Farbverlauf hinzugefügt, aber ich möchte, dass der Farbverlauf vor meinen Links erscheint und dahinter versteckt wird. Es gibt JSFiddle, Sie können es testen.Der Text wird hinter dem Farbverlauf angezeigt

Dort können Sie meine Steigung CSS auf meinem Menü

#page .page-nav { 
    background: white -webkit-linear-gradient(left, transparent 50px, red); 
    background-size: 40% 100%; 
    background-repeat: no-repeat; 
    background-position: right; 
} 

Alle Lösungen sehen, wie das zu tun?

Antwort

0

Soweit ich weiß,

Sie können es mit Verkäufer Präfixe tun und es ist nicht in IE (auch IE 11)

unterstützt, wenn hier jemand eine besseren Weg kennt um es zu implementieren, würde ich davon abraten, dies.

body { 
 
    background: #111; 
 
    width: 50%; 
 
    margin: 0 auto; 
 
    font-size: 50px 
 
} 
 
.page-nav { 
 
    background: linear-gradient(to right, #900, #999); 
 
    -webkit-background-clip: text; 
 
    -moz-background-clip: text; 
 
    -webkit-text-fill-color: transparent; 
 
    -moz-text-fill-color: transparent; 
 
}
<body> 
 
    <p class="page-nav">Sample Sample</p> 
 
</body>

Verwandte Themen