1. 程式人生 > >解決ie7和360不相容的樣式和js等問題。

解決ie7和360不相容的樣式和js等問題。

1.html的標頭檔案

2.寫相容模式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Expires" content="0">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<!–[if lte IE 8]> 
<meta http-equiv=”x-ua-compatible” content=”ie=7″ /> 
<![endif]–> 
<!–[if IE 9]> 
<meta http-equiv=”x-ua-compatible” content=”ie=9″ /> 
<![endif]–> 

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

專案在IE瀏覽器中開啟預設是Quirks模式,導致相容性不太好

這裡寫圖片描述

當然可以手動修改為Internet Explorer8 以上模式,但我們不可能引導使用者這樣去做


可以在程式碼裡通過設定DTD宣告讓瀏覽器決定用何種模式

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

改為

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/html4/strict.dtd">


樣問題就解決了


PS:

在IE11以及360瀏覽器文件模式預設為IE7版本,可以通過設定meta標籤改變為其他模式

<meta http-equiv="X-UA-Compatible" content="IE=9" />

-------------------------

使用指定的ie9js

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>demo</title>

	<!--[if lt IE 10]>
	<script type="text/javascript" src="../js/PIE_IE9.js"></script>
	<script type="text/javascript">
		$(function() {
		    if (window.PIE) {
		        $('.rounded').each(function() {
		            PIE.attach(this);
		        });
		    }
		});
	</script>
	<![endif]-->