Как переопределить HTML <FONT SIZE = "2" > с помощью CSS

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

Все происходит хорошо, пока я не наткнулся на определенную страницу продукта, которая является только оболочкой, в которую другие файлы HTML вытягиваются командой server.execute(filename). (мы используем aspx для страницы обертки.)

Есть почти 700 из этих страниц, и все они прокляты этим и тем. Прошлые редакторы с FrontPage, которые знают только, как перетащить красивые вещи на экран.

В любом случае, мне интересно, есть ли способ использовать CSS на странице обертки, чтобы переопределить поведение тегов, чтобы я мог сделать что-то здравомыслящее, которое соответствует остальным моим страницам. Я даже был бы открыт для чего-то JavaScript, который бы удалял теги, но это мое менее предпочтительное решение. Спасибо!

Ответ 1

font[size="2"] {
   property: value !important;
   ...
}

Значения свойств !important after - это то, что вы ищете.

Ответ 2

Вы можете использовать селектор атрибутов CSS в соответствии с вашим тегом шрифта:

font[size="2"] {
    font-size: 12px;
    font-weight: bold;
}

Ответ 3

Простой reset будет делать для этого случая, например.

font {
    font-size: 100%;
}

Ответ 4

Если вы можете - это означает, что если вы можете игнорировать IE6, используйте метод CSS, предложенный Эли Грей и Джеймсом Гудвином.

Чище, но более утомительным способом было бы сделать интеллектуальный поиск + заменить меняя все <font size='2'> на <span class='size_2'> или что-то еще. Это избавит вас от дрянного кода и будет работать во всех браузерах.

Ответ 5

Так как Internet Explorer игнорирует правило !important, вы можете попробовать подход Javascript, такой как следующий (использует jQuery), чтобы заменить все элементы FONT на SPAN и использовать соответствующие стили для применения форматирования.

$('font').each(function(){
  var fontFree = $('span');
  fontFree.append($(this).contents());
  fontFree.addClass('size_'+$(this).attr('size'))
  $(this).replaceWith(fontFree);
});