Sometimes, we want to localize a simple HTML web page.

In this article, we’ll look at how to localize a simple HTML web page.

How to localize a simple HTML web page?

To localize a simple HTML web page, we can set the lang attribute of the text elements and then use CSS to show or hide them according to the browser language.

For instance, we write:

<span lang="en">Scale</span>
<span lang="de">Maßstab</span>

to add the spans with text for different languages.

We distinguish them with the lang attribute.

Then we write:

[lang] {
  display: none;
}

[lang=en] {
  display: unset;
}

to select the items with different lang values.

And we set the display CSS property accordingly.

Conclusion

To localize a simple HTML web page, we can set the lang attribute of the text elements and then use CSS to show or hide them according to the browser language.