Нужна гениальная идея: как объявить разные размеры для разных шрифтов? @ Шрифт-лицо? - PullRequest
Новая
       4

Нужна гениальная идея: как объявить разные размеры для разных шрифтов? @ Шрифт-лицо?

2 голосов
/ 26 апреля 2010

Я никогда не видел, чтобы это было сделано, но у меня такое ощущение, что должен быть умный способ сделать это.

CSS-font-size-Adjust выглядит так, как будто его никогда не было, но когда я смотрю вокруг, я вижу, что происходят некоторые действительно гениальные методы CSS.

Возьмите это на вчерашних разговорах за использование @ font-face для векторных иконок.

моя задача ( обратите внимание на 2 разных размера шрифта ): 

if(user has calibri ) { font-family: calibri; font-size: 12px; }

if(user hasn't calibri ) { font-family: arial; font-size: 10px; }

Ответы [ 2 ]

2 голосов
/ 26 апреля 2010

это может сработать?

это лучшее, что я могу придумать, но я бы очень хотел избежать js .... 

<p id="font-test" style="font-family: calibri, arial; display:inline-block;">MMMMM</p>

<script>
var width = $('#font_test').attr('width');
if( width > x ){
    var has_calibri = false;
}
else{
    var has_calibri = true;
}
</script>
0 голосов
/ 21 октября 2011

Основываясь на классной идее Гарольдо и Пекки, вот несколько jQuery для изменения стиля 'h1', если два элемента имеют разную ширину. 

<style type="text/css">
    h1 { font-family:Zapfino, Georgia, Serif; font-size:30pt; }
</style>

<script type="text/javascript">
    $(document).ready(function () {
        if (hasRequiredFont())
            $('h1').css('font-size', '20pt');
    });
    function hasRequiredFont() {
        return ($('#font_test1').outerWidth() != $('#font_test2').outerWidth());
    }
</script>

<body>
    <p id="font_test1" style="font-family: Zapfino, 'Arial Narrow';
       display:inline-block; position:absolute; left:-9999px">MMMMM</p>
    <p id="font_test2" style="font-family: 'Arial Narrow';
       display:inline-block; position:absolute; left:-9999px">MMMMM</p>

    <h1>Testing</h1>
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...