Different browsers, and different versions of the same browser, support different features. ASP.NET server controls will automatically determine the browser that has requested the page and render the appropriate markup for that browser. However, some control features cannot be rendered on older browsers, so it is a good idea to look at the output of your pages on as many browser types as you can to make sure that the pages are presented to all browsers the way you want them to be.
Autodetection of Browser Types
By default, the ASP.NET page framework determines browser capabilities by reading the user-agent information passed from the browser to the server during a request. (This information is available as the
Note |
---|
The |
When the page finds a match between the current user-agent information and user agents listed in the file, it can read the corresponding browser capabilities, such as whether the browser supports scripting, styles, frames, and so on. Based on these capabilities, the controls on the page render Web controls using appropriate markup, such as XHTML, HTML 3.2, and so on. If ASP.NET is rendering HTML, it can determine whether to render recent (cascading style sheet-compliant) or earlier (non-CSS-compliant) versions of HTML elements. For older browsers, ASP.NET renders formatting information using tags (for example, a <font> tag) rather than using CSS styles.
Overriding Browser Type Detection
If you want to explicitly control how the page is rendered instead of relying on automatic browser detection, you can set the page's
The value of the ClientTarget property is an alias for the type of browser you want to render the page for. For example, to force the page to render for Microsoft Internet Explorer 6.0, you can use the alias uplevel. The alias must be defined in the
By specifying the alias downlevel, you can force the page to render HTML 3.2-compatible elements no matter what browser has requested the page. Similarly, by specifying uplevel, you can force the page to render CSS style attributes even for older browser versions.
You can create additional aliases by defining them in the Machine.config or Web.config file, which enables you to create custom browser definitions. For more information, see
Client Script
Some functionality of ASP.NET server controls depends on being able to run client script. The client script is automatically generated and sent as part of the page, if the browser is capable of executing script. Even so, some users might have turned off script execution in their browsers, and will therefore not be able to fully use the control's capabilities. For more information, see Client Script in ASP.NET Web Pages.
"Uplevel" and "Downlevel" Browser Capabilities
Browsers for desktop computers are split into two distinctive groups: "uplevel" (newer versions) and "downlevel" (earlier versions). These groups define the type of native support a browser or client device offers, and they generally determine the presentation and behavior of a loading page from a Web server.
Browsers and client devices that are considered "uplevel" usually support at least the following:
-
ECMAScript (JScript, JavaScript) version 1.2.
-
HTML version 4.0.
-
The Microsoft Document Object Model (MSDOM).
-
Cascading style sheets (CSS).
"Downlevel" browsers and client devices support the following only:
-
HTML version 3.2
The server control properties listed in the following table render differently in uplevel and downlevel browsers.
Server control property | Rendering behavior in uplevel and downlevel browsers |
---|---|
AccessKey |
This property does not work on any downlevel browsers for any controls. It is not HTML 4.0 and works only in Internet Explorer 4.0 or later. |
BackColor |
This property works on downlevel browsers for only certain controls: |
BorderColor |
This property works on downlevel browsers only for the same table-based controls as BackColor. However, it is output as the bordercolor attribute, which is not part of the HTML 3.2 standard. Some browsers support this attribute, including Internet Explorer 3.0 and later, but not all browsers do. |
BorderStyle |
This property does not work on any downlevel browsers. There is no equivalent to it in HTML 3.2. |
BorderWidth |
This property works only in controls that render as an HTML <table> element (Table, Panel, GridView, and Calendar) or as an <img> element ( |
CssClass |
This property is always rendered as the class attribute, regardless of the browser. Most uplevel browsers recognize the class attribute. |
Enabled |
This property is used to specify whether a control raises its events and functions. In Internet Explorer 4.0 or later, setting Enabled to false has the effect of making the control appear unavailable and locked from input, using the disabled=true attribute. |
Font-Bold, Font-Italic, Font-Strikeout and similar properties |
These properties are rendered as style attributes for uplevel browsers (for example, Font-Weight for bold and Font-Style for italic) and as independent elements (for example, <b> and <i>) for downlevel browsers. |
Font-Size |
This property works on downlevel browsers for all controls only if named font sizes are used (Small, Smaller, and so on). In uplevel browsers, this property is rendered as a style attribute; in downlevel browsers, it is rendered as a <font> element. |
Font-Overline |
This property does not work on any downlevel browser. |
ForeColor |
This property works on downlevel browsers for all controls except Image, AdRotator, |
Height |
This property does not work on downlevel browsers for Label controls, validator controls, HyperLink controls, or LinkButton controls. Height also does not work for CheckBoxList, RadioButtonList, and DataList controls if the layout for those controls is set to Flow. Only pixel and percentage measurements work. For table-based controls, this is nonstandard HTML and will work only in later uplevel browsers. |
TabIndex |
This property does not work on any downlevel browsers for any controls. It is not HTML 4.0 and only works in Internet Explorer 4.0 or later. |
ToolTip |
This property does not work on any downlevel browsers. |
Width |
This property does not work on downlevel browsers for Label, HyperLink, LinkButton, or validator controls. Width also does not work for CheckBoxList, RadioButtonList, and DataList controls if the layout is set to Flow. Only pixel and percentage measurements work. |