如何让Visual Studio和web标准联姻

核心提示： 查看页面的源文件，我们发现，如何让Visual Studio和web标准联姻(5)，服务器端的Label控件打到前台的已经不是span，而是label了，前台网页制作和后台编码是应该分开进行的，但是在项目设计阶段，这样我们就将服务器端控件的呈现进行了重新的设置，实例二：根据浏览器的类型

查看页面的源文件。我们发现，服务器端的Label控件打到前台的已经不是span，而是label了。这样我们就将服务器端控件的呈现进行了重新的设置。

实例二：根据浏览器的类型，设置不同的样式。如果是IE浏览器就对刚才的那个label使用“cssTest”样式class，如果是Firefox浏览器就对刚才的那个label设置“cssTest_FF”样式class。

Step1:在页面上写2个样式class，参考如下：

<styletype="text/css">
　　 .cssTest{
　　 color:red;
　　 }
　　 .cssTest_FF{
　　 color:green;
　　 }
</style>

Setp2：将test.browser里面的代码删除，添加新的代码如下：

<browsers>　
　 <browserrefID="IE">
　　 <controlAdapters>
　　 <adaptercontrolType="System.Web.UI.WebControls.Label"adapterType="LabelAdapter"/>
　　 </controlAdapters>
　 </browser>
　 <browserrefID="MozillaFirefox">
　　 <controlAdapters>
　　　 <adaptercontrolType="System.Web.UI.WebControls.Label"adapterType="LabelAdapter_FF"/>
　　 </controlAdapters>
　 </browser>　
</browsers>

Setp3：创建一个名为“LabelAdapter_FF”的类。类代码如下（解释见注释）：

ImportsSystem
ImportsSystem.Web.UI
ImportsSystem.Web.UI.WebControls
PublicClassLabelAdapter_FF
　　 InheritsSystem.Web.UI.WebControls.Adapters.WebControlAdapter
　　 ProtectedOverloadsReadOnlyPropertyControl()AsLabel
　　　　 Get
　　　　　　 ReturnDirectCast(MyBase.Control,Label)
　　　　 EndGet
　　 EndProperty
　　 ProtectedOverridesSubRenderBeginTag(ByValwriterAsHtmlTextWriter)
　　　　 writer.WriteLine()
　　　　 writer.AddAttribute(HtmlTextWriterAttribute.Id,Control.ClientID)
　　　　 IfNotString.IsNullOrEmpty(Control.ControlStyle.CssClass)Then
　　　　　　 writer.AddAttribute(HtmlTextWriterAttribute.Class,Control.ControlStyle.CssClass&"_FF")‘用原来cssClass加上”_FF”这个样式class
　　　　 EndIf
　　　　 writer.AddStyleAttribute("font-weight","bold")’也可以直接样式属性
　　　　 writer.RenderBeginTag(HtmlTextWriterTag.Div)‘这里换成div了，只是演示而已
　　　　 writer.Indent=writer.Indent+1
　　 EndSub
　　 ProtectedOverridesSubRenderEndTag(ByValwriterAsHtmlTextWriter)
　　　　 writer.Indent=writer.Indent-1
　　　　 writer.RenderEndTag()
　　　　 writer.WriteLine()
　　 EndSub
　 ProtectedOverridesSubRenderContents(ByValwriterAsHtmlTextWriter)
　　　　 RenderContent(writer)
　　 EndSub
　　 PrivateSubRenderContent(ByValwriterAsHtmlTextWriter)
　　　　 writer.Write(Control.Text)
　　 EndSub
EndClass

Step4：编译、运行。

在IE和FF中分别查看源文件，发现不仅应用的样式不同，连打到前台的标签都不同了。效果图如下：

后记：很多朋友应该知道“ASP.NET CssFriendlyAdapters”这个工具，其实原理就是这个。不过那个能够解决更大型的控件的呈现而已。有兴趣的朋友可以自己搞搞。

vs2005中browsers是个很了不起的东西。小弟才浅，这里只是利用了它很少的一部分功能，但是依然解决了一直困扰“网页设计师”的两个问题。

虽然从社会分工的角度上来看，前台网页制作和后台编码是应该分开进行的。但是在项目设计阶段，如果有一个既懂前台网页设计又懂后台程序的角色好像也挺不错的。