Statement to determine browser version and compatible with multiple browsers
|
<!--[if lte IE 6]> <![endif]--> Visible in IE6 and below <!--[if lte IE 7]> <![endif]--> Visible in IE7 and below <!--[if IE 6]> <![endif]--> Only IE6 version is visible <![if !IE]> <![endif]> Versions other than IE <!--[if lt IE 8]> <![endif]--> Visible in IE8 and below <!--[if gte IE 7]> <![endif]--> Visible in IE7 and below usage: (1) You can use the following code to detect the current IE browser version (note: the effect will not be seen in non-IE browsers) <!––[if IE]> <h1>You are using Internet Explorer</h1> <!––[if IE 5]> <h2>Version 5</h2> <![endif]––> <!––[if IE 5.0]> <h2>Version 5.0</h2> <![endif]––> <!––[if IE 5.5]> <h2>Version 5.5</h2> <![endif]––> <!––[if IE 6]> <h2>Version 6</h2> <![endif]––> <!––[if IE 7]> <h2>Version 7</h2> <![endif]––> <![endif]––> What if the current browser is IE, but the version is lower than IE5? You can use <!–[if ls IE 5]>. Of course, conditional comments can only be used in the IE5+ environment, so <!–[if ls IE 5]> will not be executed at all. lte: is the abbreviation of Less than or equal to, which means less than or equal to. lt: It is the abbreviation of Less than, which means less than. gte: is the abbreviation of Greater than or equal to, which means greater than or equal to. gt: It is the abbreviation of Greater than, which means greater than. ! : It means not equal, which is the same as the not equal to judgement operator in JavaScript (2) How to apply conditional comments is explained at the beginning of this article. Because different versions of IE browsers interpret the WEB standard pages we make differently, specifically, they interpret CSS differently. In order to be compatible with these, we can use conditional comments to define them separately and ultimately achieve the purpose of compatibility. For example: <!-- By default, the css.css style sheet is called first--> <link rel="stylesheet" type="text/css" href="css.css" />< !-–[if IE 7]> <!–- If the IE browser version is 7, call the ie7.css style sheet- –> <link rel="stylesheet" type="text/css" href="ie7.css" />< ![endif]–-> <!–-[if lte IE 6]> <!–- If the IE browser version is less than or equal to 6, call the ie.css style sheet-–> <link rel="stylesheet" type="text/css" href="ie.css" />< ![endif]–> This distinguishes the execution of CSS between browsers lower than IE7 and IE6, achieving compatibility. At the same time, the default css.css in the first line can also be compatible with other non-IE browsers. Note: The default CSS style should be located in the first line of the HTML document, and all content for conditional comment judgment must be located after the default style. For example, the following code is displayed in red when executed in IE browser, but in black when executed in non-IE browsers. If the conditional comment judgment is placed in the first line, it cannot be implemented. This example can well illustrate how to solve the compatibility problem between IE browser and non-IE browser. <style type="text/css"> body{ background-color: #000; } < /style> < !-–[if IE]> <style type="text/css">body{background-color: #F00;}< /style>< ![endif]–-> At the same time, some people may try to use <!–-[if !IE]> to define the situation in non-IE browsers, but please note: conditional comments can only be executed in IE browsers. This code will not only not execute the definition under the condition in non-IE browsers, but will be ignored as a comment. Normal is the default style, and conditional comments are performed only when special processing is required for IE browsers. In HTML files, not in CSS files. These comments are now available in DWcs4: in "Window -> Code Snippet -> Comments". I haven't noticed the other versions. |
<<: Tutorial on installing Ceph distributed storage with yum under Centos7
>>: Nodejs-cluster module knowledge points summary and example usage
Recommend
JavaScript countdown to close ads
Using Javascript to implement countdown to close ...
A brief discussion on which fields in Mysql are suitable for indexing
Table of contents 1 The common rules for creating...
How to install JDK and Mysql on Ubuntu 18.04 Linux system
Platform deployment 1. Install JDK step1. Downloa...
Open the Windows server port (take port 8080 as an example)
What is a Port? The ports we usually refer to are...
How to implement html input drop-down menu
Copy code The code is as follows: <html> &l...
Implementation code of short video (douyin) watermark removal tool
Table of contents 1. Get the first link first 2. ...
Nginx location matching rule example
1. Grammar location [=|~|~*|^~|@] /uri/ { ... } 2...
Vue implements user login switching
This article example shares the specific code of ...
Vue implements a visual drag page editor
Table of contents Drag and drop implementation Dr...
Summary of methods for querying MySQL user permissions
Introduce two methods to view MySQL user permissi...
WeChat applet implements jigsaw puzzle game
This article shares the specific code for impleme...
How to delete a property of an object in JavaScript
1. delete delete is the only real way to remove a...
React's reconciliation algorithm Diffing algorithm strategy detailed explanation
Table of contents Algorithmic Strategy Single-nod...
Detailed explanation of the process of setting up nvidia-docker environment on Linux server
Docker is equivalent to a container, which can bu...
Analysis of 2 implementation methods of configuring jnid data source in Tomcatc3p0
Using c3p0 Import the c3p0jar package <!-- htt...