Static Html Website - Bootstrap - Multi language Support

Bootstrap has nothing to do with that. No, you cannot translate a site using pure CSS. You'll have to change the HTML source to contain different text. Yes, you can do that by making a copy of all your HTML files and changing the text in them. Typically you'd have a server-side language with HTML templates which enable you to swap in translations for text dynamically without having to have a complete copy of your code. However, it doesn't sound like this is something you would be able to get up and running quickly enough.

Detection of client language and serving an appropriate version of the site is also something that will require some amount of server-side programming. Again, it doesn't sound like something you would be able to get into quickly enough.


You can do this within a single file without using any server-side programming languages. You should check out i18next for a proper javascript solution.

You can also use pure CSS to translate a homepage. Try something like

.en, .de, .it { display:none; } /* hide all elements with a language class */
.en:lang(en), .de:lang(de), .it:lang(it) { display:block; } /* show those elements that match their language class */

When you set a proper lang attribute on your html tag (e.g. by javascript) you can translate your page very easy:

<div class="en">Good morning</div>
<div class="de">Guten Morgen</div>
<div class="it">Ciao</div>