你~還在用IE6瀏覽器嗎?該換掉了哦，除了前陣子Google發佈自3/1起也就是今天將不支援IE6瀏覽器，而且也將Gear技術改成使用HTML5的最新技術，然後Youtube也將從3/13起也不支援IE6，而且也將慢慢的改用HTML5的新技術，所以如果你還在使用XP預設的IE6瀏覽器，再過不久你可能進到一些網站後會發現怎麼版面都亂七八糟，不然就是東缺西缺的，沒錯，這就是IE6的超級大問題，所以趕緊更換成其它瀏覽器或升級IE才是王道哦。

如果你已經準備好要放棄IE6了，請直接觀看其它瀏覽器吧！

IE8：https://steachs.com/archives/641
Google Chrome：https://steachs.com/archives/1427
Firefox：https://steachs.com/archives/1415
Opera：https://steachs.com/archives/890
Safari：https://steachs.com/archives/799

 

之前丫湯有介紹過在自己的網站上加入IE6提醒用戶的訊息，如果你想換個新樣式可以參考一下方的語法。

樣式展示：

01

在Header的<body>下方加入以下語法：

<!--[if lte IE 6]>

<div id="ie6warning">

<div id="warning"></div>

<div id="warningtext">您用的是舊版的IE6瀏覽器，強烈建議您升級為IE8或是使用Chrome、Firefox、Safari、Opera等瀏覽器</div>

<div id="opera"><a href="https://steachs.com/archives/890" title="前往Opera瀏覽器" alt="前往Opera瀏覽器"/>Opera</a></div>

<div id="safari"><a href="https://steachs.com/archives/799" title="前往Safari瀏覽器" alt="前往Safari瀏覽器"/>Safari</a></div>

<div id="chrome"><a href="https://steachs.com/archives/1427" title="前往Google Chrome瀏覽器" alt="前往Google Chrome瀏覽器"/>Chrome</a></div>

<div id="firefox"><a href="https://steachs.com/archives/1415" title="前往Firefox瀏覽器" alt="前往Firefox瀏覽器"/>Firefox</a></div>

<div id="ie"><a href="https://steachs.com/archives/641" title="前往IE8瀏覽器" alt="前往IE8瀏覽器"/>IE8</a></div>

</div>

<![endif]-->

然後CSS的部份：

#ie6warning{

background:#393d3e;

width:970px;

height:32px;

margin:15px auto;

padding-left:10px;

}

#warning{

background:url(http://image.steachs.com/ie6waring/warning.png) no-repeat;

height:32px;

width:32px;

float:left;

}

#warningtext{

padding:8px 10px 0;

font-size:13px;

color:#FFF;

float:left;

}

#ie a{

background:url(http://image.steachs.com/ie6waring/IE.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 0.5;filter:alpha(opacity=50);zoom:1;

}

#ie a:hover{

background:url(http://image.steachs.com/ie6waring/IE.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 1;filter:alpha(opacity=100);zoom:1;

}

#firefox a{

background:url(http://image.steachs.com/ie6waring/firefox.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 0.5;filter:alpha(opacity=50);zoom:1;

}

#firefox a:hover{

background:url(http://image.steachs.com/ie6waring/firefox.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 1;filter:alpha(opacity=100);zoom:1;

}

#chrome a{

background:url(http://image.steachs.com/ie6waring/chrome.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

display:block;

padding-right:5px;

opacity: 0.5;filter:alpha(opacity=50);zoom:1;

}

#chrome a:hover{

background:url(http://image.steachs.com/ie6waring/chrome.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 1;filter:alpha(opacity=100);zoom:1;

}

#safari a{

background:url(http://image.steachs.com/ie6waring/safari.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 0.5;filter:alpha(opacity=50);zoom:1;

}

#safari a:hover{

background:url(http://image.steachs.com/ie6waring/safari.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:5px;

opacity: 1;filter:alpha(opacity=100);zoom:1;

}

#opera a{

background:url(http://image.steachs.com/ie6waring/opera.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:10px;

opacity: 0.5;filter:alpha(opacity=50);zoom:1;

}

#opera a:hover{

background:url(http://image.steachs.com/ie6waring/opera.png) no-repeat;

height:32px;

width:32px;

float:right;

text-decoration:none;

text-indent:-999em;

padding-right:10px;

opacity: 1;filter:alpha(opacity=100);zoom:1;

}

Categorized in:

網路大小事,

Last Update: 2010 年 03 月 01 日

Tagged in:

, , ,