我想在Boilerplate HTML模板中使用Paul Irish的条件评论:
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
SharePoint 2010母版页中的。我读过'有条件的评论在SP2010中并不总是那么好用'。 (不确定这意味着什么!)建议是使用:
<SharePoint:CSSRegistration Name="foo.css" ConditionalExpression="gte IE 7" runat="server" />
这允许我使用条件来加载特定的样式表,但不能像Paul Irish建议的那样使用条件html标记。有没有办法做到这一点,或者我只是简单地将Biolerplate中的代码粘贴到Sharepoint主页中?
答案 0 :(得分:4)
我认为SharePoint主页与ASP.NET(MVC)中的相同。因此,这根本不是问题。
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
以上所有代码都是在HTML标记上设置HTML标记,具体取决于哪个浏览器访问该网站。这样您就可以覆盖任何给定浏览器(IE)的一些样式表。
site.css
.coloredBackground
{
background-color: #FF0000; //red
}
.ie6 .coloredBackground
{
background-color: #00FF00; //green
}
.ie8 .coloredBackground
{
background-color: #0000FF; //blue
}
在此示例中,使用Firefox,Opera,Safari,IE7,9,10浏览的用户将看到红色背景。对于IE6,背景颜色被绿色覆盖,而IE8则覆盖蓝色。
您的CSS注册如下所示:
<SharePoint:CSSRegistration Name="site.css" runat="server" />
正如您所看到的,不再需要在CSS注册中设置ConditionalExpression,因为您已经通过在HTML元素上设置特定类来切换使用的样式表。
<强>更新强>
另一种可能性是使用SharePoint aspx控件上的ConditionalExpression属性,根据浏览器版本包含另一个样式表文件。
<SharePoint:CSSRegistration Name="ie6.css" ConditionalExpression="lt IE 7" runat="server" />
<SharePoint:CSSRegistration Name="ie7.css" ConditionalExpression="IE 7" runat="server" />
<SharePoint:CSSRegistration Name="ie8.css" ConditionalExpression="IE 8" runat="server" />
<SharePoint:CSSRegistration Name="ie9.css" ConditionalExpression="IE 9" runat="server" />
缺点是您可能会遇到CSS优先级问题,因为html元素上缺少.ie*
类,因此不会否决.class-to-override-if-specific-ie-version
。您可以使用ie特定样式表文件中的!important
规则来解决此问题。
答案 1 :(得分:3)
我是SharePoint品牌推广的新手,遇到了同样的问题。我不是ASP开发人员,所以理解一些解决方案有点困难。
我所做的是将Paul的条件语句与HTML标记一起移动到BODY标记中,它看起来非常完美,不需要乱用SP代码。
<!--[if lt IE 7]> <body class="no-js lt-ie9 lt-ie8 lt-ie7" scroll="no" onload="javascript:_spBodyOnLoadWrapper();"> <![endif]-->
<!--[if IE 7]> <body class="no-js lt-ie9 lt-ie8" scroll="no" onload="javascript:_spBodyOnLoadWrapper();"> <![endif]-->
<!--[if IE 8]> <body class="no-js lt-ie9" scroll="no" onload="javascript:_spBodyOnLoadWrapper();"> <![endif]-->
<!--[if gt IE 8]><!--> <body class="no-js" scroll="no" onload="javascript:_spBodyOnLoadWrapper();"> <!--<![endif]-->
希望有所帮助。
答案 2 :(得分:2)
在我的第一个回复被删除后再次发帖。这已经过编辑,以更好地满足StackOverflow的发布指南。
我使用过这个(来自Paul的帖子底部,日期为2012/1/17),它在SharePoint母版页中运行良好。请注意,这与您发布的内容不同,后者是代码的早期版本。
<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class=""> <!--<![endif]-->
我担心的是SharePoint页面可能需要删除的其他内容。以下是原始的SharePoint HTML标记:
<html lang="<%$Resources:wss,language_value%>" dir="<%$Resources:wss,multipages_direction_dir_value%>" runat="server" xmlns:o="urn:schemas-microsoft-com:office:office" __expr-val-dir="ltr">
一旦你开始在HTML标签中添加带有条件注释的内容,页面就会中断。
我建议您查看HTML / CSS,看看是否可以删除某些条件CSS以帮助简化您的解决方案。
答案 3 :(得分:1)
我使用ASP文字字符串在我的SP2010主页中传递条件IE注释。
这样,我仍然可以传入原始<html>
代码<%$Resources:wss,language_value%>
中使用的语言值。
<asp:literal ID="html1a" runat="server" Text="&lt;!--[if lt IE 7]&gt; &lt;html class=&quot;no-js lt-ie9 lt-ie8 lt-ie7&quot; lang=&quot;"/><asp:Literal ID="html1b" runat="server" Text="<%$Resources:wss,language_value%>" /><asp:literal ID="html1c" runat="server" Text="&quot;&gt;&lt;![endif]--&gt;"/><br />
<asp:literal ID="html2a" runat="server" Text="&lt;!--[if IE 7]&gt;&lt;html class=&quot;no-js lt-ie9 lt-ie8&quot; lang=&quot;"/><asp:Literal ID="html2b" runat="server" Text="<%$Resources:wss,language_value%>" /><asp:literal ID="html2c" runat="server" Text="&quot;&gt;&lt;![endif]--&gt;"/><br />
<asp:literal ID="html3a" runat="server" Text="&lt;!--[if IE 8]&gt;&lt;html class=&quot;no-js lt-ie9&quot; lang=&quot;"/><asp:Literal ID="html3b" runat="server" Text="<%$Resources:wss,language_value%>" /><asp:literal ID="html3c" runat="server" Text="&quot;&gt;&lt;![endif]--&gt;"/><br />
<asp:literal ID="html4a" runat="server" Text="&lt;!--[if gt IE 8]&gt;&lt;!--&gt; &lt;html class=&quot;no-js&quot; lang=&quot;"/><asp:Literal ID="html4b" runat="server" Text="<%$Resources:wss,language_value%>" /><asp:literal ID="html4c" runat="server" Text="&quot;&gt;&lt;!--&lt;![endif]--&gt;"/>
但如果有人可以进一步改进这种方法,我们将不胜感激!
答案 4 :(得分:0)
使用Sharepoint 2010时,最好避免在<html>
标记周围放置条件。话虽这么说,您可以在<head>
标记内添加条件,并使用Javascript将类添加到html标记中。这对于常规网站来说并不理想,但对于Sharepoint,这是一种不显眼的方法,适用于我帮助维护的大型企业Sharepoint 2010网站:
...
<html id="Html1" class="no-js" lang="<%$Resources:wss,language_value %>" dir="<%$Resources:wss,multipages_direction_dir_value %>" runat="server" __expr-val-dir="ltr">
<head id="Head1" runat="server">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="Expires" content="0"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- IE version conditionals will apply classes to html element if old IE -->
<!--[if lt IE 7 ]><script type="text/javascript">var element = document.getElementById("ctl00_Html1"); element.className += " " + "lt-ie7";</script><![endif]-->
<!--[if lt IE 8 ]><script type="text/javascript">var element = document.getElementById("ctl00_Html1"); element.className += " " + "lt-ie8";</script><![endif]-->
<!--[if lt IE 9 ]><script type="text/javascript">var element = document.getElementById("ctl00_Html1"); element.className += " " + "lt-ie9";</script><![endif]-->
<!--[if lt IE 10 ]><script type="text/javascript">var element = document.getElementById("ctl00_Html1"); element.className += " " + "lt-ie10";</script><![endif]-->
...