this question can create a misunderstanding: I know I have to use CSS to validate successfully my document as XHTML 1.0 Transitional. The fact is that I have to embed in my webpage a picture composed by zeros and ones created with text image, and the problem is that the code uses deprecated tag font and looks like this
<!-- 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 -->
(In this code example I inserted a newline after each couple of tags to make it more readable, but the original code is all in one line because of the <pre>
tag).
The font's color changes at least thousands times so I never considered to create a field in the CSS for each combination.Hope someone knows at least where to find a solution, I searched everywhere :)
Thanks
You could replace
<font color="#000000">0001100000101101100011</font>
with
<span style="color:#000000">0001100000101101100011</span>
etc...
*Edit: I know this is CSS, but it doesn't involve a separate stylesheet like the question states, which may be ok.
Thanks a lot! :D I used this code
<!-- 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 -->
It works correctly! :D
What about javascript ?
Send the color data as a JSON array, the '0' and '1' as another array and dynamically generate the DOM elements.
<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>
Or something like this...
Why does it need to validate?
The solution you've already got is absolutely fine for what you're doing. It works. This is not a meaningful document that should be marked up with semantic tags for improved accessibility; it's a work of art, so feel free to ignore the rules if it helps you express your intentions more clearly.
If validation is part of the artistic statement you're trying to make, then use <span style="color:#ff00ff;">00</span>
as suggested by other posters - but that'll increase your file size considerably.
Another approach is just to change the doctype so you're not targetting XHTML Transitional - use <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
or some earlier HTML revision instead.
来源:https://stackoverflow.com/questions/358663/what-tag-should-i-use-instead-of-deprecated-tag-font-in-html-cannot-use-css