我正在设计一个网站,并在运行Openwave移动浏览器6.2.3.2的lgvx8360手机上进行测试。在我的网站上有很多东西看起来不对劲,我注意到浏览器没有正确处理CSS子选择器或子选择器。我做了一个这样的页面:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Mobile test</title>
<style type="text/css">
div div {
background: yellow}
</style>
</head>
<body>
<div>test 1 - this div should have no background</div>
<br>
<div><div>test2 - this div should have a yellow background</div></div>
</body></html>
编辑:
我做了菲利佩建议的一些测试。不管声明后面是否有分号,我都会看到同样的东西。我试着去掉style元素,并将黄色背景放在内部test2div的一个style属性中,一切都按预期进行。我尝试添加“div{background:red;}”,但两个div仍然是黄色的。我切换了测试1和测试2的div,两个div都是黄色的。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Mobile test</title>
<style type="text/css">
div {
background: red;}
.foo div {
background: yellow;}
</style>
</head>
<body>
<div>test 1 - this div should be red.</div>
<br>
<div class="foo"><div>test 2 - this div should be yellow.</div></div>
</body></html>
两个女主角都是红色的。我用id代替class做了类似的事情,两个div都是红色的。
我试着将字符集设置为ISO-8859-1,结果一切都一样,所以我认为这与问题无关。我去掉了meta标签,一切都没变。
我试着把CSS放到一个外部文件中。当我使用link元素包含它时,我看到的结果与以前相同。如果我尝试使用@import包含它,我看不到任何样式。我的手机似乎无法访问使用@import引用的CSS文件。
不用说,这快把我逼疯了。我做的测试越多,情况就越奇怪。我能怎么办?
编辑2:
当然,我可以买一部新手机,但我正在努力建立一个网站,可以在任何一种支持互联网的设备上工作。
我看着
this guide
与移动CSS兼容,找不到任何关于我的浏览器的信息。我正要去查看博客帖子。
编辑4: