Показывает внутренний текст индикатора выполнения HTML5?Технические причины для этого не будут реализованы? - PullRequest
2 голосов
/ 23 апреля 2019

В документации MDN для <progress> представлен следующий пример:

<progress value="70" max="100">70 %</progress>

Этот элемент содержит текстовый узел 70 %, но нигде не отображается,Мне любопытно две вещи.Во-первых, если есть способ отобразить это.(Возможно, некоторые CSS по умолчанию препятствуют этому? Обратите внимание, что я не ищу никаких хаков, которые требуют позиционирования других элементов. Этот вопрос отличается от других в Stack Overflow тем, что мне любопытно, есть липравильные способы показать этот текст.)

Что касается второго вопроса, я предполагаю, что это невозможно без обходных путей.Мне любопытно, почему это так. В спецификации утверждается, что элемент <progress> может содержать фразы.Элемент требует начального и конечного тега.Кажется, он явно настроен на содержание.Какова техническая причина для предотвращения отображения этого контента?

1 Ответ

1 голос
/ 27 апреля 2019

На ваш второй вопрос я нашел это в спецификации

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

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

Что касается вашего первого вопроса, я действительно сбит с толку. Я сделал fiddle здесь, где я скопировал все вычисленные атрибуты стиля из тега p в тег progress. Помимо изменения внешнего вида индикатора выполнения, он, похоже, ничего не делал со скрытым текстовым узлом, что заставляет меня думать, что браузер просто прямо игнорирует его и не является CSS по умолчанию.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...