Вопрос по svg, html, css – Должно ли содержимое SVG быть видимым вне встроенного <svg> по умолчанию? [закрыто]

9

В прошлом я отвечал на вопрос о том, кто был не прав. в отношении изображений SVG, не являющихся «обрезанными» (overflow: hidden) в IE9, где все остальные поддерживающие браузеры делали это. ОтветВот.

Сегодня, еще раз просматривая HTML5 Boilerplate, я заметил, что они утверждают, что они& quot; [правильное] переполнение не скрыто в IE9 & quot; с этим битом кода:

<code>svg:not(:root) { overflow: hidden; }
</code>

Я ищу кого-то, кто подтвердит или опровергнет мое оригинальное исследование, указав на некоторые другие примечания в спецификациях HTML5 или SVG. Я ничего не могу найти, но хочу быть уверенным, что ничего не пропустил.

Лучшее, что я могу найти, - это то, что они пытаются применить правило 7Вот, но это должно применяться только к документу SVG, например, черезimg тег или при загрузке напрямую.

@casperOne Как запрос о разъяснении спецификации не является реальным вопросом? Я вижу плохую формулировку, но не вижу, как она соответствует категории, которую вы пометили. Это слишком локализовано? Kevin Peno
Спасибо за редактирование заголовка @Phrogz. У меня были некоторые проблемы с тем, как именно сформулировать вопрос. Kevin Peno
Вопрос актуален и конструктивен. Он просит уточнить спецификацию, которая по-разному реализована в разных браузерах, что относится к разработке браузеров, если ничего больше ... Yarin
@casperOne Я понимаю, откуда вы, но на самом деле я прошу помощи в понимании их интерпретации (большинство браузеров и шаблон) по сравнению с моей. В частности, гдеI ошиблась в моих исследованиях. Единственное упоминание о том, «кто прав» вот где я цитировал (плохо) из предыдущего ответа для контекста, почему я спрашивал в первую очередь. Спасибо за информацию, хотя я буду помнить о ней на будущее. Kevin Peno
Вы хотите, чтобы кто-то разъяснил, был ли кто-то прав или нет. Я мог бы открыть его снова, но затем я просто закрыл бы его снова как «Неконструктивно». casperOne

Ваш Ответ

2   ответа
4

занных вами оснований (в частности, пятого и седьмого пунктовспецификация).

Кажется невероятным, что IE верен, а Webkit и Firefox - нет. Однако, как вы подозреваете, седьмой пункт пулиis дифференцирующий фактор.

Если вы загружаетеэтот тест в Chrome и используйте Инструменты разработчика для проверки SVG, вы увидите:

(user agent stylesheet)

svg:not(:root), symbol, image, marker, pattern, foreignObject {
  overflow: hidden;
}

Если вы включите & quot; Показать пользовательский агент CSS & quot; в Firebug вы видите это правило в Firefox:

svg.css (line 49) <System>

svg:not(:root), symbol, image, marker, pattern, foreignObject {
  overflow: hidden;
} 

Наконец, если вы редактируете контрольный пример, чтобы добавитьsvg { overflow:hidden } тогда IE визуально совпадает с другими браузерами.

Таким образом, мне кажется, что все три браузера ведут себя в соответствии со спецификацией, но Chrome / Safari / FF имеют правила UA, которые более точно соответствуют ожиданиям большинства пользователей.

If I could leave well-enough alone, this is where I'd stop this answer.

Однако если выизменить тестовый пример, чтобы добавитьsvg { overflow:visible }и Chrome, и Firefox не «правильно». показать переполненное содержимое. Я не уверен, как разрешить эту точку данных с остальной частью этого ответа. : /

Мнение (не ответ): без поведения Chrome и Firefox, есть смысл, что<svg width="4" height="4" viewBox="0 0 1 1" style="overflow:visible">Error: User Rate Limit Exceeded
Error: User Rate Limit ExceededoverflowError: User Rate Limit Exceededoverflow: hidden. Kevin Peno
Спасибо за подробный ответ. (Также мнение) Я согласен, что большинство людей, особенно тех, кто более знаком с бинарными изображениями и тегами изображений, не ожидают переполнения изображения SVG по умолчанию. Приведенная выше ссылка @ Robert выявляет интересный конфликт в управлении при сравнении стандартного UA,must be реализовано против правила 7 (ключевое слово SVG Document) +w3.org/TR/SVG/styling.html#Scope Kevin Peno
4

http://www.w3.org/TR/SVG/styling.html#UAStyleSheet

Похоже на то, что Firefox и Chrome не делают?

После прочтения приведенной выше ссылки для обсуждения, ссылки в вашем ответе и перечитывания спецификации теперь имеет смысл, что требуемая спецификацией таблица стилей UA делает IE9 недействительным. Спасибо за помощь! Kevin Peno
Спасибо что подметил это. Похоже, что конфликт в требуемой таблице стилей по умолчанию для элементов пространства имен SVG конфликтует с правилом 7 выше +w3.org/TR/SVG/styling.html#Scope ? Kevin Peno
This discussion актуально.
Хороший, хотя (согласно моему ответу) и Chrome, и FF используют одну и ту же слегка модифицированную версию. (Возможно, есть ошибки вокруг этого?) Таким образом, это означает, что IE был неправ, что не имел этого листа UA. Тем не менее, это не полностью прояснить для меняoverflow:visible не вызывает появление пути переполнения в Chrome / FF. Это, возможно, отдельный вопрос, но каковы ожидания относительно «границ» SVG? Когда границы будут когда-либо превышать явныеheight а такжеwidth?

Похожие вопросы