Question

我想制作两种语言的网站。我通过制作两个样式表来使用CSS，当点击按钮时它会切换

<html>
<head>
<style type="text/css">
    body.fr :lang(en) {
      display: none;
    }
    body.en :lang(fr) {
      display: none;
    }
</style>
</head>
<body>
    <button onclick="document.body.className='en'">English</button>
    <button onclick="document.body.className='fr'">French</button>
    <p lang="en">This is English</p>
    <p lang="fr">This is French</p>
</body>
</html>

问题是加载页面时，会出现所有样式表。我想只显示一个样式表，默认的是英文

任何人都可以帮助我吗？谢谢你的帮助

Answer 1

试试这个：

<html>
  <head>
    <style type="text/css">
      body.fr > p[lang=en] {
        display: none;
      }
      body.en > p[lang=fr] {
        display: none;
      }
    </style>
  </head>
  <body class="en">
    <button onclick="document.body.className='en'">English</button>
    <button onclick="document.body.className='fr'">French</button>
    <p lang="en">This is English</p>
    <p lang="fr">This is French</p>
  </body>
</html>

使用CSS制作多语言网站

1 个答案: