64x64 icon dark hosting
Get a Tuts+ subscription for just $45! Deploy New Relic now to claim.
Advertisement

Quick Tip: Nonintrusive CSS Text Gradients

by

Though not completely cross browser compatible, there are ways to nonintrusively create pure CSS text-gradients with a bit of trickery. The key is to use a mix of attribute selectors, webkit-specific properties, and custom HTML attributes.


Final Simple HTML

By using custom attributes, we can then hook into these values from within our stylesheet by using the attr() function.


Final CSS

Note: Paul referenced an even more succinct method in the comments. Be sure to check that out as well!

Advertisement