Селектор значений атрибута произвольной подстроки не работает в IE7

#html #css #internet-explorer-7 #css-selectors

#HTML #css #internet-explorer-7 #css-селекторы

Вопрос:

У меня есть облако тегов, которое мне нужно оформить. К сожалению, в нем нет классов, и я не могу редактировать код.

Проблема: я использую следующий код:

 .tag-cloud a[style*="xx-large"]{
font-size:140% !important;
}
  

Для целевого:

 <div class="tag-cloud">
<a href="" style="font-size:xx-large;">Events</a>
</div>
  

тип документа равен: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Это не работает в Internet Explorer 7. Насколько я знаю, это должно работать.

Обновить:

CMS, которую я использую, комментирует doctype в ie7. Похоже, это проблема. Не CSS. Спасибо.

Комментарии:

1. «Селектор значений атрибута произвольной подстроки» исправил это, извините

2. Просмотрите исходный код на своей странице и посмотрите, есть ли в нем <!DOCTYPE... строка.

3. Также сбой в IE9 в режиме стандартов IE7

4. Делает: <!DOCTYPE html PUBLIC»-//W3C//DTD XHTML 1.0 строгим//RU» » w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd «>

5. Ваш тестовый HTML-файл не работает, потому что вам нужно объявление doctype, прежде чем IE7 заставит его работать.

Ответ №1:

Если вы не против использования javascript, это можно было бы очень легко решить с помощью jQuery:

 $(function() {
   $(".tag-cloud a[style='font-size:xx-large']").css("font-size", "140%");
});
  

Комментарии:

1. Это решение. И, вероятно, то, что я в конечном итоге сделаю.

2. Лично я не сторонник полагаться на Javascript для достижения возможностей CSS, но в этом случае вы, вероятно, увидите большую кроссбраузерную совместимость с использованием Javascript, чем с использованием селектора атрибутов CSS, так что, вероятно, это ваш лучший выбор.