糖果自我挑戰,
把圖片採用CSS向量定位~
讓不同解析度的使用者都可以享有完整的水族箱XD
素材來自楓之谷水世界...從WZ檔案取出...逃
會不會哪天糖果用CSS和HTML5設計出一款web2.0楓之谷?....
糖果突破了IE6 png 透明通道問題XD
還有IE系列無法使用半透明效果修正~
採用IE6原生透明通道使用法....
以上是火狐的顯示裝況!!
火狐顯示的效果最為優秀~
同樣的網站我在小島導覽也有放上喔!!
以上是Chorme的展示!!
CSS3效果都有呈現,
但是文字有點位移....
這是Android手機上的展示
沒想到手機顯示的效果是最棒的...
都想要設定為桌布了=口=|||
這是悲劇的IE9,
沒想到正式推出,
圓角功能還是悲劇阿...
有修正方式,在特定情況IE會載入....所以我有留著...
另外透明效果~
filter:alpha(opacity=70);
opacity: 0.7;
要靠這招套用CSS~
這是70%的範例
至於悲劇的IE六,
我讓她可以透明PNG顯示,
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="pic/1.png", sizingMethod='scale');
把她加入IE專用CSS
<!--[if lt IE 7]>
<link rel="stylesheet" href="styleIE.css" type="text/css">
<![endif]-->
再利用IE only遊戲引導
<![endif]-->
<!--[if gte IE 7]><!-->
<link rel="stylesheet" href="style.css" type="text/css">
<!--<![endif]-->
最後再弄一個排除IE7以下(不含)還有其他瀏覽器可讀取的語法~
然後弄上標準語法
background: url("pic/1.png") no-repeat center;
這樣子就可以多瀏覽器相容XD
又讓他可以半透明....
唯獨下面點走板XD...
懶得改阿...=ˇ=|||
圓角沒有也是當然的=3=
但是有些人可以正常修復圓角,
所以糖果也寫出來,
首先下載http://fetchak.com/ie-css3/ie-css3.htc
然後與網頁放在一起...
<!--[if IE]>
<style type="text/css">
#search_area {
border-radius: 5px;
behavior: url(ie-css3.htc);
}#link a {
border-radius: 5px;
behavior: url("ie-css3.htc");
}
</style><![endif]-->
在網頁裡直接寫入CSS圓角語法如範例方式~
一定要寫在HTML.....寫在css獨立檔案他無法運作...
記得要加上IE only語法,讓其他瀏覽器跳過IE的設定~
這樣子就大功告成了XD
不過我記得微軟的特色就是要方角...
新手機系統也是一堆方塊...
跟apple的圓角圖案唱反調XD
IE6一整個悲劇= =
竟然還一大堆人在用@@
我這邊IE總量只有2成....
事實上我的網站用IE看是完全悲劇...
IE中CSS圓角最簡單的解決方法:
使用Flash= =
使用gif或者png不是更好0.0....
用IE8開入口網站,畫面上面的光影會一片灰...
一片灰?....深奧
不過IE6正常喔~
只差在沒有圓角,
道理IE8異常0.0
IE6~IE8整死我了...
話說小島用IE系列看其實異常說XD....懶得修復=ˇ=|||
IE6就算了吧
是阿,我只是要讓他可以縣市案的進來....=ˇ=|||
終於看到傳說中的即時隱藏查詢 XD
想說就跟著放出好了~
就順智把它弄出來XD
現在在研究製作NPC對話
移過去會顯示詳細資訊
報告 IE在我的眼裡 已經廢了(誤
不過IE要修改一堆東西還真悲劇..
因為這是要正式上線的網站....
所以還是得搞一下=ˇ=