为什么我的两种语言样式表都出现在页面加载中,而不仅仅是默认的? [英] Why do both of my language stylesheets appear on page load rather than just the default one?
本文介绍了为什么我的两种语言样式表都出现在页面加载中,而不仅仅是默认的?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想做一个支持两种不同语言的网站.我制作了两个样式表并添加了一些在按钮被点击时会切换的代码:
I want to make a website which supports two different languages. I made two stylesheets and added some code that will switch when the buttons are clicked:
<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>
问题在于,当页面加载时,所有样式表都会出现.我只想出现一个样式表;默认为英文.
The problem is that, when the page is loaded, all stylesheets appear. I want only one stylesheet appear; the default one is English.
推荐答案
尝试向 body 标签添加默认语言,而不仅仅是您想要使用不同语言的元素:
Try adding a default language to the body tag rather than just the elements you want to be in different languages:
body.fr > p[lang=en] {
display: none;
}
body.en > p[lang=fr] {
display: none;
}
<html>
<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>
这篇关于为什么我的两种语言样式表都出现在页面加载中,而不仅仅是默认的?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文