Какой тег мне следует использовать вместо устаревшего шрифта тега в HTML (нельзя использовать CSS)

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

  •  21-08-2019
  •  | 
  •  

Вопрос

этот вопрос может вызвать недоразумение:Я знаю, что мне нужно использовать CSS для успешной проверки моего документа как XHTML 1.0 Transitional.Дело в том, что мне нужно встроить на свою веб-страницу картинку, составленную из нулей и единиц, созданную с помощью текстовое изображение, и проблема в том, что код использует устаревший шрифт тега и выглядит так

<!-- IMAGE BEGINS HERE -->
<pre>
    <font size="-3">
        <font color="#000000">0001100000101101100011</font>
        <font color="#010000">00</font>
        <font color="#020101">0</font>
        <font color="#040101">0</font>
        <font color="#461919">1</font>
        <font color="#b54f4f">1</font>
        ...etc.etc...
    </font>
</pre>
<!-- IMAGE ENDS HERE -->

(В этом примере кода я вставил новую строку после каждой пары тегов, чтобы сделать его более читабельным, но исходный код весь находится в одной строке из-за <pre> ярлык).Цвет шрифта меняется как минимум тысячи раз, поэтому я никогда не рассматривал возможность создавать поле в CSS для каждой комбинации. Хоп кто -то знает, по крайней мере, где найти решение, я искал везде :) Спасибо

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

Решение

Вы могли бы заменить

<font color="#000000">0001100000101101100011</font>

с

<span style="color:#000000">0001100000101101100011</span>

и т. д...

*Редактировать:Я знаю, что это CSS, но он не требует отдельной таблицы стилей, как указано в вопросе, и это может быть нормально.

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

Большое спасибо!:D Я использовал этот код

<!-- IMAGE BEGINS HERE -->
<div style="font-size:x-small;font-family:monospace">
    <span style="color:#000000">0001100000101101100011</span>
    <span style="color:#010000">00</span>
    ...etc.etc...
</div>
<!-- IMAGE ENDS HERE -->

Это работает правильно!:D

А как насчет яваскрипта?

Отправьте данные цвета в виде массива JSON, «0» и «1» в качестве другого массива и динамически сгенерируйте элементы DOM. 

<script>
values = [1, 0, 0, 1, ... ]
colors = ["010000", "020101", ...]

for (i = 0; i < values.length; i++) {
    span = createElement("span"); // use a portable function for creating elements
    span.setAttribute("style", "color:#"+colors[i]);
    txtNode = document.createTextNode(values[i]); 
    span.appendChild(txtNode);
    document.appendChild(span);
}
</script>

Или что-то в этом роде...

Зачем нужно подтверждение?

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

Если подтверждение является частью художественного заявления, которое вы пытаетесь сделать, используйте <span style="color:#ff00ff;">00</span> как предлагают другие авторы, но это значительно увеличит размер вашего файла.

Другой подход — просто изменить тип документа, чтобы вы не ориентировались на XHTML Transitional — используйте <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> или вместо этого какую-то более раннюю версию HTML.

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