想找資料嗎?到這看看也許會有收穫喔。
‧wordpress: 佈景主題 / 插件介紹 #
‧網站教學 : css新手必看 / css筆記 / seo
‧電影片單 : 驚悚 / 懸疑 / 靈異 / 動作 / 文藝 / 劇情 / 喜劇 / 紀錄 / 科幻 / 史詩 / 戰爭 / 動畫
2008/09/04

技巧 | css hack


今天花了一點時間改個版面
其實也只有把外觀換了一下,內頁仍然不變(懶?)

因為我現在使用的瀏覽器是opera,加上我又有灌firefox、google瀏覽器,以及內建的ie6.0,在排版上面真的搞了一陣子orz。
本家是用opera,當然是以他為主,不過他跟FF的差異也沒太大,
google瀏覽器也許是依據W3C,我看了也沒太大問題,唯一怪異的地方就是文字太小
已經設定11px號字體,用google瀏覽器看到的字卻很奇怪(如圖)

使用google瀏覽器看到的字體

但是仍然可以使用快捷鍵 ctrl+ 讓文字放大,加上目前G browser可能還不是主流,所以就先放著了。

問題較大的仍然是ie6.0
不知道為什麼,他邊界的算法總是跟人家不一樣!!!
本來可以使用!important帶過去的,但是現在又加上了opera的因素,所以要重新去查有什麼方法可以解決這種情況。
後來才知道,原來他還有一個專有名字,叫做「css hack」:D

最後使用以下方法,成功解決opera、firefox、ie6之間的兼容問題
ps.家裡沒有ie7可以測試,就麻煩大家幫我看看囉:)

。只對ie6有影響

color: #fff;
_color: #000;

(ie6讀出來會是黑色,其他瀏覽器則為白色)

。對firefox、opera有影響

color: #fff;
color: #000 !important;

(firefox以及opera讀出來會是黑色,其他瀏覽器則為白色)

。只對opera有影響

#your_class {
color: #fff;
}

@media all and (min-width: 0px){
#your_class {
color: #000;
} }

(opera讀出來會是黑色,其他瀏覽器則為白色)

大概就是這樣子
可以利用這些小撇步來兼容每個伺服器
但是還是提醒大家,這種東西別用太多,畢竟他是bug....

Related Posts with Thumbnails
人氣:1,778    
  • 引用網址:
  • 文章標籤:,
  • 上篇文章:
  • 下篇文章:

    1. comments(8)
    2. 風痕影
      #1
      風痕影//LV.27
      2008/09/10

      對了,底線改成 * 號的話
      可以同時對 IE 7 和 6 產生影響唷 ^^

    3. muki
      #2
      muki//LV.948
      2008/09/11

      喔喔
      謝謝風痕影XDDD(筆記

    4. 果子
      #3
      果子//LV.14
      2008/09/16

      ie7會跑位喔!~我筆記裡面有我最常用的css hack。你有需要的話可以去翻翻喔。呵~

    5. 果子
      #4
      果子//LV.14
      2008/09/16

      呵。再回一下。
      我看到的跑位問題有可能是旁邊的php錯誤影響的。
      錯誤語法:
      Warning: unserialize() expects parameter 1 to be string, array given in /home/s760502/public_html/blog/wp-content/plugins/wheredidtheygov1.php on line 64
      你可以去找找原因。~

    6. muki
      #5
      muki//LV.948
      2008/09/16

      喔喔,好XD
      等我明天睡醒去看看果的筆記:)

    7. muki
      #6
      muki//LV.948
      2008/09/16

      剛把plugin拿掉了XD
      沒有錯誤了,麻煩果再幫我看一下喔^^

    8. 果子
      #7
      果子//LV.14
      2008/09/17

      左邊剩下一個:)的符號
      可右邊最下方多了一排原本好像在左邊的東西都跑到左下了說。呵..
      下面ie有已完成,但是網頁發生錯誤唷。

    9. muki
      #8
      muki//LV.948
      2008/09/18

      謝謝果子喔~
      應該是沒問題了!!!...
      為了每個瀏覽器還有解析度,突然覺得好累 囧!?

    comments(8)



    :wink: :-| :-x :twisted: :) 8-O :( :roll: :-P :oops: :-o :mrgreen: :lol: :idea: :-D :evil: :cry: 8) :arrow: :-? :?: :!: