CSS-селектор для использования в меню SIFR - PullRequest
Новая
       21

CSS-селектор для использования в меню SIFR

1 голос
/ 29 января 2010

Я успешно использовал sIFR для простых приложений, таких как заголовки, я пытаюсь использовать два разных шрифта одновременно - один для заголовка и один для меню.
Заголовок работает, но не меню. Я использую тему Tofurious Wordpress . Это раздел таблицы стилей темы, который управляет шрифтом меню и стилями ссылок: 

/*MENU COLORS****************/
#menu {
 background:#bc7d90;
}

#menu li a {
 font:11px Arial, Helvetica, sans-serif; /*MENU FONT STYLES*/
 text-transform: uppercase;
 color:#fff; /*MENU FONT COLOR*/
}

#menu li a:hover {
 color:#ecd1d9; /*MENU FONT COLOR WHEN HOVERING*/
}

Я ввел #menu li a как Item To Replace на странице настроек sIFR , а затем использовал этот код: 

.sIFR-root { font-size:15px; font-weight:normal; color:#fff; }
a { text-decoration:none; color:#fff; }
a:hover { color:#fff; }

Шрифт появляется, но не с любым из указанных выше стилей, и неожиданно появляется в блоге. Вы можете увидеть пример по этому адресу: www.laurenparkinson.com / blog

Кроме того, сами пункты подменю вообще не отображаются.

1 Ответ

0 голосов
/ 29 января 2010

Вы окажете большую услугу, полностью отключив sIFR для @ font-face, который теперь поддерживается во всех основных браузерах, включая IE, начиная с версии 4 (дополнительная информация о совместимости: http://webfonts.info/wiki/index.php?title=@font-face_browser_support).


@font-face {
 font-family: myFont1;
 src: url('myFont1.eot'); /*For IE*/
 src: local('myFont1'), url('myFont1.ttf') format('truetype');
}
@font-face {
 font-family: myFont2;
 src: url('myFont2.eot'); /*For IE*/
 src: local('myFont2'), url('myFont2.ttf') format('truetype');
}

#header{
 font-family: myFont1, Georgia, Times New Roman, Serif;
}

#menu {
 font-family: myFont2, Verdana, Arial, Sans-serif;
}

Просто убедитесь, что ваши шрифты лицензированы для встраивания.

Онлайн конвертер eot: http://www.kirsle.net/wizards/ttf2eot.cgi

...