首先，我在把 ie 瀏覽器更新到 11 後，在 f12 除錯工具中發現一片空白，解決方法如下：
安裝補丁：
64位的系統應該使用下面這個補丁：http://www.microsoft.com/en-us/download/details.aspx?id=45154
32位的系統應該使用下面這個補丁：http://www.microsoft.com/zh-CN/download/details.aspx?id=45134

接下來講解 css 相容 ie 的方法。

一、以外掛形式的相容方法

    1、首先去除各瀏覽器差異，或使用如下外掛，或使用自己所編寫的 reset.css 檔案

    <link href="https://cdn.bootcss.com/normalize/7.0.0/normalize.min.css" rel="stylesheet">

    2、解決 ie9 以下瀏覽器對 html5 新增標籤不識別的問題。

    <!--[if lt IE 9]>
        <script type="text/javascript" src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"> 
        </script>
    <![endif]-->

    3、解決 ie9 以下瀏覽器不支援 CSS3 Media Query 的問題

    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"> </script>

二、相容性書寫

    1、相容字首

• -o-transform:rotate(7deg); // Opera

• -ms-transform:rotate(7deg); // IE

• -moz-transform:rotate(7deg); // Firefox 

• -webkit-transform:rotate(7deg); // Chrome 

• transform:rotate(7deg); // 統一標識語句

    2、解決 Placeholder

    <input type="text" value="Name *" onFocus="this.value = '';" onBlur="if (this.value == '') {this.value = 'Name *';}">

    3、解決 IE9 以下瀏覽器不能使用 opacity

• opacity: 0.5; 

• filter: alpha(opacity = 50); 

• filter: progid:DXImageTransform.Microsoft.Alpha(opacity = 50);

    更多相容性解決方法：http://www.chinaz.com/web/2017/0830/800058.shtml

三、css hack

    1、條件 hack

    語法：
    <!--[if <keywords> IE <version>]>
        HTML程式碼塊
    <![endif]-->
    注：條件 hack 只在 ie 10 以下有效
    詳情：http://www.css88.com/book/css/hack/conditions.htm

    2、屬性級 hack

    語法： selector{<hack> property:value<hack> ;}
    eg: *color: #ff0; 或 color: #ff0\9;
    詳情：http://www.css88.com/book/css/hack/properties.htm

    3、選擇符級 hack

    語法：<hack> selector{ sRules }
    詳情：http://www.css88.com/book/css/hack/selectors.htm

    更多css hack 識別符號見：https://baike.baidu.com/item/css%20hack/7026361?fr=aladdin

四、hack 的應用情景及技巧

    https://www.duitang.com/static/csshack.html