YUI Reset CSS делает <strong><em>это не работает</em></strong>

StackOverflow https://stackoverflow.com/questions/20107

  •  09-06-2019
  •  | 
  •  

Вопрос

Эта строка в YUI Сбросить CSS вызывает у меня затруднения:

address,caption,cite,code,dfn,em,strong,th,var {
    font-style: normal;
    font-weight: normal;
}

Это делает мой em не курсив и мой strong не смело.Это нормально.Я знаю, как переопределить это в моей собственной таблице стилей.

strong, b 
{
  font-weight: bold;
}

em, i 
{
  font-style: italic;
}

Проблема возникает, когда у меня есть текст, который одновременно em и strong. 

<strong>This is bold, <em>and this is italic, but not bold</em></strong>

Мое правило для strong делает это жирным шрифтом, но правило YUI для em делает его снова нормальным.Как мне это исправить?

Это было полезно?

Решение

Если ваше сильное заявление приходит после YUI, ваше должно его переопределить.Вы можете заставить это сделать так:

strong, b, strong *, b * { font-weight: bold; }
em, i, em *, i * { font-style: italic; }

Если вы все еще поддерживаете IE7, вам нужно добавить !important.

strong, b, strong *, b * { font-weight: bold !important; }
em, i, em *, i * { font-style: italic !important; }

Это работает - убедитесь сами:

/*YUI styles*/
address,caption,cite,code,dfn,em,strong,th,var {
  font-style: normal;
  font-weight: normal;
}
/*End YUI styles =*/

strong, b, strong *, b * {
  font-weight: bold;
}

em, i, em *, i * {
  font-style: italic;
}
 <strong>Bold</strong> - <em>Italic</em> - <strong>Bold and <em>Italic</em></strong>

Другие советы

Я бы использовал это правило, чтобы отменить сброс YUI:

strong, b, strong *, b *
{
  font-weight: bold;
}

em, i, em *, i *
{
  font-style: italic;
}

Если в дополнение к использованию YUI reset.css вы также используете YUI base.css, то у вас будет стандартный набор кросс-браузерных базовых стилей.

СВЯЗЬ: http://developer.yahoo.com/yui/base/

У меня возникла аналогичная проблема, когда я добавил сброс YUI в начало моего стандартного CSS-файла.Я обнаружил, что для меня лучше всего просто удалить все

font-weight: normal;

объявления из сброса YUI.Я не заметил, чтобы это повлияло на что-то «кроссбраузерное».

Все мои заявления были сделаны после сброса YUI, поэтому я не уверен, почему они не подействовали.

Пока ваши стили загружаются после сброса, они должны работать.Что это за браузер?поскольку я сам работаю аналогичным образом и не сталкивался с этой проблемой, мне интересно, не виновата ли в этом что-то в моем тестировании.

Таблицы стилей сброса лучше всего использовать в качестве основы.Если вы не хотите сбрасывать em илиstrong, удалите их из таблицы стилей.

Как сказал Крис, вам не обязательно использовать именно тот CSS, который они предоставляют неукоснительно.Я бы просто сохранил копию на вашем сервере и отредактировал ее в соответствии с вашими потребностями.

Я бы посоветовал избегать всего, что связано со взломом файлов YUI.Вам необходимо иметь возможность обновлять внешние библиотеки в будущем, и если ваш сайт использует отредактированные версии, есть большая вероятность, что он выйдет из строя.Я думаю, что это общая хорошая практика для любой сторонней библиотеки, которую вы используете.

Поэтому я подумал этот ответ был одним из лучших

Если в дополнение к использованию YUI reset.css вы также используете YUI base.css, то у вас будет стандартный набор кросс-браузерных базовых стилей.

Я понимаю, что вы говорите.Я думаю, вы можете добавить следующее правило CSS:

strong em { font-weight: bold; }

или:

strong * { font-weight: bold; }

Я думал, что у меня есть идеальное решение:

strong, b 
{
  font-weight: bold;
  font-style: inherit;
}

em, i 
{
  font-style: italic;
  font-weight: inherit;
}

К сожалению, Internet Explorer не поддерживает «наследство». :-(

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top