CSS目标Windows Phone 7 [英] CSS to target Windows Phone 7

查看：203 发布时间：2017/1/20 3:04:57 html css windows-phone-7

本文介绍了CSS目标Windows Phone 7的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试添加一个以Windows Mobile为目标的.css文件， media =handheld对此设备不执行任何操作， a href =http://windowsteamblog.com/windows_phone/b/wpdev/archive/2011/03/22/targeting-mobile-optimized-css-at-windows-phone-7.aspx>官方Windows Phone网站，其总结为：

 <！ -  [if IEMobile 7] 
< p>欢迎使用Internet Explorer Mobile。< / p> 
<！[endif]  - > 
<！[if！IEMobile 7]> 
< p>所有其他浏览器< / p> 
<！[endif]>

问题

正如预期的那样，在Firefox和桌面版Internet Explorer中，它会显示应该：所有其他浏览器。

> Windows Phone 7还会显示所有其他浏览器。我在条件注释中尝试使用和不使用7，但结果相同。

我的.html中没有什么可能会导致问题，因为我测试在此：

 < html> 
< body> 
< p>有效工作< / p> 
<！ -  [if IEMobile 7]> 
< p>欢迎使用Internet Explorer Mobile。< / p> 
<！[endif]  - > 
<！[if！IEMobile 7]> 
< p>所有其他浏览器< / p> 
<！[endif]> 
< / body> 
< / html>

此在线版本暂时在这里。

我从官方网站复制粘贴代码，WP7上的Internet Explorer设置指定移动版本为首选版本。我也有这个更新。

在 perishablepress.com 文章我读过指定 media =Screen在正常的非手持样式表声明上的S）将迫使WP7使用 media =handheld声明，但是这对我没有效果。

问题

？如果是的话，你的解决方案是什么？

请记住，我真的在寻找如何使WP7选择手机版的.css，而不是如何解决条件注释问题。谢谢您的时间！

编辑

我添加了一个javascript（谢谢w3schools.com ）要求浏览器信息（与'navigator'），这是我得到我的设备（三星Omnia ，btw）：

 有效
所有其他浏览器
浏览器代码：Mozilla 
浏览器名称：Microsoft Internet Explorer 
浏览器版本：5.0（兼容; MSIE 9.0; Windows Phone OS 7.5; Trident / 5.0; IEMobile / 9.0; SAMSUNG; OMNIA7）
 Cookie启用：true 
平台： Win32 
用户代理头：Mozilla / 5.0（兼容; MSIE 9.0; Windows Phone OS 7.5; Trident / 5.0; IEMobile / 9.0; SAMSUNG; OMNIA7）
  如果不是IEMobile 7，显示所有其他浏览器。由于浏览器是IE9，因此显示所有其他浏览器
 
 
 编辑 - 您可以尝试使用Javascript来检测。我从此处修改了此代码。
  browserUA = navigator.userAgent.toLowerCase（）; 
 if（browserUA.search（'windows phone os 7'）> -1）
 // windows phone因此加载WP CSS文件
 else 
 //它是一些其他浏览器
  
当然，用户代理可以轻松更改，所以为安全起见，不要使用此方法。但是，对于Windows Phone检测，它应该工作。
 
I'm trying to add a .css file that targets Windows Mobile, and as media="handheld" does nothing for this device I've followed instructions from an official Windows Phone site, which sum up to this:
<!--[if IEMobile 7]>
<p>Welcome to Internet Explorer Mobile.</p>
<![endif]-->
<![if !IEMobile 7]>
<p>All other browsers</p>
<![endif]>




The Problem

As expected, in Firefox and desktop version of Internet Explorer this displays what it should: "All other browsers".

Unfortunately, my Windows Phone 7 also displays "All other browsers". I tried with and without "7" in the conditional comment, same result.

There is nothing else in my .html that could be causing problems, because I'm testing on this:
<html>
    <body>
        <p>Does work</p>
        <!--[if IEMobile 7]>
            <p>Welcome to Internet Explorer Mobile.</p>
        <![endif]-->
        <![if !IEMobile 7]>
            <p>All other browsers</p>
        <![endif]>
    </body>
</html>
The online version of this is temporarily here.

I copy pasted the code from the official site, and my Internet Explorer settings on WP7 specifies Mobile Version as preferred version. I also have that Mango update.

In an perishablepress.com article I've read that specifying media="Screen" (capitalizing the S) on a normal, non-handheld stylesheet declaration will force WP7 to use the media="handheld" declaration, however this didn't work for me.



Question

Does anyone have experience with targeting WP7 with a .css? If yes, what is your solution?

Bear in mind that I'm really looking for how to make WP7 select a mobile version of the .css, not how to solve the conditional comment problem. Thank you for your time!

Edit

I've added a javascript (thank you w3schools.com) to ask for the browser information (with 'navigator'), this is what I get for my device (Samsung Omnia, btw):
Does work
All other browsers
Browser CodeName: Mozilla
Browser Name: Microsoft Internet Explorer
Browser Version: 5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0; SAMSUNG; OMNIA7)
Cookies Enabled: true
Platform: Win32
User-agent header: Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0; SAMSUNG; OMNIA7)

 解决方案 
Mango runs IE9, not IE7. Your check says, if not IEMobile 7, display 'All other browsers'. Since the browser is IE9, All other browsers is displayed.

Edit - You could try using Javascript to detect it. I adapted this code from here.
browserUA = navigator.userAgent.toLowerCase();
if (browserUA.search('windows phone os 7') > -1)
   //windows phone therefore load WP CSS file
else
   //it's some other browser
Of course, user-agents can be changed easily so don't use this method for security reasons. However, for Windows Phone detection, it should work.

                        这篇关于CSS目标Windows Phone 7的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！


                    
                        查看全文

CSS目标Windows Phone 7 [英] CSS to target Windows Phone 7

问题描述

问题

问题

编辑

The Problem

Question

Edit

相关文章

前端开发最新文章

热门教程

热门工具

登录关闭

CSS目标Windows Phone 7 [英] CSS to target Windows Phone 7

问题描述

问题

问题

编辑

The Problem

Question

Edit

相关文章

前端开发最新文章

热门教程

热门工具

登录 关闭

登录关闭