I'm trying to apply a different style (using font-feature-settings: 'aalt';) for a single letter type: an uppercase R.
As expected, the whole div that has the style applied gets changed to the stylistic alternate.
Is there a way to get it to work on just the R?
Is there a way to get it to work on just the R?
Apply the style only to the letters that you want to stylize:
body { font-family: sans-serif; }
.line { display: block; line-height: 1.5rem; }
.stylized { color: red; }<div>
<h1><span class="stylized">R</span>ow, <span class="stylized">R</span>ow, <span class="stylized">R</span>ow Your Boat</h1>
<p>
<span class="line"><span class="stylized">R</span>ow, row, row your boat,</span>
<span class="line">Gently down the stream.</span>
<span class="line">Merrily, merrily, merrily, merrily,</span>
<span class="line">Life is but a dream.</span>
</p>
</div>