Создание дробей с помощью замены на символ из шрифтов OpenType

Демонстрация работы символов дробей из шрифта OpenType, адаптация примера из урока Dudley Storey, специально для сайта dejurka.ru

HTML

<p>Возьмите <span>3⁄4</span> стакана муки.</p>

CSS

@font-face {
        font-family: 'Megalopolis';
        src: url('http://thenewcode.com/assets/fonts/megalopolisextra-webfont.eot');
        src: url('http://thenewcode.com/assets/fonts/megalopolisextra-webfont.eot?#iefix') format('embedded-opentype'),
                 url('http://thenewcode.com/assets/fonts/megalopolisextra-webfont.woff') format('woff'),
                 url('http://thenewcode.com/assets/fonts/megalopolisextra-webfont.ttf') format('truetype'),
                 url('http://thenewcode.com/assets/fonts/megalopolisextra-webfont.svg#megalopolis') format('svg');
        src: url('http://thenewcode.com/assets/fonts/megalopolisextra-webfont.otf');
}
p span{ 
        font-family: Megalopolis, serif; 
        font-feature-settings: "frac";
        font-size: 2rem;
}