Short Answer: CSS isn’t really designed for that sort of thing, you should probably look into a different solution. It is technically possible though.
You can actually set the content of CSS elements, but only :before
and :after
elements that are applied to the element. Therefore, if you have an element like
<td id="HelloText">Hello</td>
You can have it “translated” to Spanish with
#HelloText
{
font-size: 0; // hides existing text
}
#HelloText:after
{
font-size: 14px;
content: "Hola";
}
This isn’t really ideal though, because this adds more bloat to your CSS and HTML (your page is loading the English and other language text), and this won’t really work well for large blocks of text, or formatted text, eg text with <span>
tags or <a>
tags.
Not to mention that this is really bad for SEO. A search engine crawler normally just looks at a page’s HTML (and sometimes Javascript) to index the page, never at what is in the CSS files attached to the page.
You definitely want to talk to the programmers that have access to the HTML to see if you can implement a server-side or Javascript solution for translation.
8
solved How to edit HTML with CSS? [closed]