睡蓮‧池水間

Guest
2012-Feb-07  
0 位會員和 12 位訪客在線上

文章 :: 語言集

文章列表  全部 

普通 精華 焦點 全部
預設 時間 標題 評分 閱讀 評論 引用 | 逆序 順序

文章

更多...
  • Chrome 的 CSS bug
      最近為 XOOPS 正體中文站討論區加裝票選模組並在測試站下用不同瀏覽器進行檢視,以測試嵌入於帖子中的票選內容是否正常,郤發現帖子上的標題不見了,由此便得知 Chrome 一直存在的 CSS bug。  Chrome 的問題很怪異,即使跟 Chrome 同一核心引擎的 Safari ,也不會出現如 Chrome 的 CSS bug,加上只在特定的文字如「關」字並配合 CSS 中的 text-shadow,便會發揮作用,把標題文字「關」起來不讓看得見,只在骨子底下的原始碼裡顯露出來。  如果閣下...
  • CSS3 Media Queries 詳解
    CSS3 Media Queries 詳解 - 上
    CSS3 Media Queries 詳解 - 下
  • 你需要知道的CSS3動畫技術
    譯序:本文譯自Smashingmagazine,但是原文講述的內容有些淺,也不是很完整,前端觀察在翻譯的前提下,增加了更多的更系統的內容。如有不足之處,歡迎指正補充。

    前端觀察 - http://www.qianduan.net/what-you-need ... about-behavioral-css.html
  • IE 7 下慎用 :first-letter 偽元素
      不久前在正體中文站替一位網友解決 IE 8下佈景問題時,發現用 IE 7 及 6 版本進入網站,CPU 會飈高,持續載入中的空白畫面久久沒有回應,被逼要中止程式,而 IE 8 及其他瀏覽器就無此問題。( 補註:更正為只有 IE 7版本,IE 6 的於後來經再測試後確定無問題。)   是什麼原因導致 CPU 飈高?這是繼上次替網友測試某專業佈景網站所提供的佈景而發現<title>排序問題後的另一個挑戰自己的難題 ...   在我的認知裡,會因佈景問題造成 CPU 飈高...
  • HTML 5 新功能演示
    譯者:Direct Guo這是一個 HTML 5 的新功能的演示文檔,幾乎包括 HTML 5 的所有激動人心的新功能的簡介和演示。IE 瀏覽器系列瀏覽器無法瀏覽,firefox、opera 等瀏覽器只能使用部分功能,如果想100%演示成功,請使用最新版的“谷歌瀏覽器(Google Chrome)”,建議使用最新版。英文原版: http://apirocks.com/html5/html5.html中文版演示文檔請看此處: http://directguo.com/html5/
  • CSS 3 變換入門
    本文譯者:神飛  譯文出處:前端觀察 - http://www.qianduan.net/css-transitions-101.html  儘管人們期望在屏幕上有些改變,但是 CSS 和 HTML 對頁面中的交互能做的實在太少了,而那些還需要用代碼來實現。   比如一個鏈接要麼是這個顏色,要麼是那個顏色;一個文本區域要麼這麼大,要麼那麼大;一張圖片要麼是透明的要麼是不透明的;它們是從一個狀態直接變到另一個狀態——中間並沒有過渡。   這導致大部分網頁...
  • 使用 CSS3 創建動畫效果
    概述在 CSS3 中新增了幾個很好玩的東東:CSS Animation,CSS Transition 和 CSS Transform,顧名思義就是通過 CSS 來實現動畫,過渡和變形。它們與 HTML5 中的 canvas 能繪製動畫圖形不同,這些只能應用在已存在的元素上,但這足以讓我很興奮了,我不必要在去寫那些複雜的 JS 代碼,運用它們我能更簡單的創建自己的想要的動畫。應用前景伴隨著 CSS3 的普及,這些特性被各大瀏覽器支持也只是時間上的問題。有消息稱在 Internet Explorer 9 中將更好的支持 HTML5 和 CSS3...
  • 於文章中嵌入自訂的FLV/MP4播放器
      在網上隨處閒逛,不難見到大多網站尤其是網誌都有在文章內容上插入 YouTube 影片,有些還看到影片原作者利用 YouTube 空間,將自製而成的影片上傳到 YouTube,然後複製代碼,嵌回到自己的網站去。   YouTube 的存在,帶擎了 FLV 格式的盛行,而緊隨其後的會是 YouTube 的高畫質 ─── MP 4 格式。   現在,要將自製的 FLV 或 MP4 格式影片直接上傳到自己的網站空間上播放,不需要 YouTube,只要有播放器就能輕易實現,還可按個人喜好設定,在不同...
  • 用 CSS 3 將你的設計帶入下個高度
    用 CSS 3 將你的設計帶入下個高度 - 1
    用 CSS 3 將你的設計帶入下個高度 - 2
    用 CSS 3 將你的設計帶入下個高度 - 3
  • 如何在 IE 中使用 HTML 5 元素
    Sjoerd Visscher 發現了一個簡潔的方法樣式在 IE 中作用到未知的元素上 —— 僅需 JS 創建此未知元素即可: document.createElement(elementName) 同理(對於 IE 來說 HTML5 元素即是未知元素),該方法也可順延到 HTML5 的元素上(詳細見:John Resig 寫的 《HTML5 Shiv》 一文): <html> <head> <style>section { color: red; }</style> <script>document.createElement("section")</script> </head> <body> <section>Hello World!</section> </body> </html...
  • 解決IE 7、8下的 object 框線問題
    iframe 是最常見的網頁嵌入標籤,但到了XHTML 1.0 Stict 之下,這種標籤便不允許使用了。需要嵌入網頁,可以用object標籤取替之。 object標籤用途廣,除了可嵌入網頁、媒體外,還可取代 img標籤之用等。但IE對object的支援尚不完全,即使是開始支援網頁標準的最新版IE 8,仍有不完美的地方。 例如在取代 iframe 作為網頁嵌入上,標準瀏覽器下可以給object設定為border:none以去除框線,但在IE下是無效。IE的各個版本中,IE 6甚或較低版本的IE5.5可以改為通...
  • Firefox和IE之間7個JavaScript的差異
    譯者:糖伴西紅柿 譯文出處:www.qianduan.net/between-firefox-and-ie-differences-7-javascript.html 盡管 JavaScript 歷史上使用冗長而令人生厭的代碼塊來標的特定瀏覽器的時期已經結束了,但是偶爾使用一些簡單的代碼塊和對象檢測來確保一些代碼在用戶機器上正常工作依然是必要的。 這篇文章中,我會略述一下 Internet Explorer 和 Firefox 在 JavaScript 語法上不同的 7 個方面。 1. CSS “float” 屬性 獲取給定對象的特定 CSS 屬性的基本語法是 object.style 屬性...
  • 難以發現的 CSS 問題
    話說昨天在Opera瀏覽器下為池水間進行網站優化和代碼改良時,間隔了一段長時間才去打開firefox檢視一下網站,這下不看猶自可,一看嚇了一跳,在firefox下的池水間變得面目全非,馬上打開其他瀏覽器查看,結果safari也是和firefox一樣有問題,只有opera和IE都正常,這是怎麼回事了?從firefox和safari出現的徵狀來看,似乎是瀏覽器在解析CSS語法上出問題,打開CSS查看了語法,來回檢查了好幾遍,偏偏就沒有找到錯漏之處,連CSS檔的編碼也是正確的utf8。...
  • 提升網站效能的 CSS Sprites
    近來在為池水間進行網站優化,將XHTML和CSS代碼改良,其中CSS就首次使用了CSS Sprites技術,以提升網站效能。什麼是CSS Sprites?就是將多個圖片匯集到一個大圖片上,然後在CSS裡將每個使用不同背景圖路徑全部劃一改為集成圖片路徑,並給每個背景圖定位。例如下面的無序列表,每一個 li 標籤分別用五個不同背景圖: <ul> <li class="image1"> image1 背景 </li> <li class="image2"> image2 背景 </li> <li class="image3"> ima...
  • 註釋在IE中造成文字溢出的研究
    在藍色論壇看到這樣一篇帖子 《IE中發現新BUG “重影”》,覺得很有意思。於是在想到底是什麼原因造成的呢?便做了以下測試:實驗代碼如下:( 按此打開實驗板 ) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml ... nal.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>多了一隻豬</title> </head> <bod...
  • HTML 5 的結構和語義
    前言(一)
    結構(二)
    語義性的塊級元素(三)
    語義性的內聯元素(四)
    內嵌媒體(五)
    交互(六)
  • 完美的頁腳固定法
    頁面由上至下包含header、main和footer這樣佈局的網站隨處可見,但當main內容不足導致頁面高度少於瀏覽器的時候,頁面底部便會留下空白位。遇到此問題時可以參看這個值得推荐的範例網站 -- CSS Sticky Footer,該站所提供的完美解決方案,幾乎所有瀏覽器都支援,無論main內容再怎麼少、螢幕解析度再怎麼大,footer都會固定在最底部。範例演示站:http://www.cssstickyfooter.com/觀看CSS代碼:http://www.cssstickyfooter.com/style.css觀看HTML代碼:http://www.cssstickyfooter.com/ht...
  • 優先等級的行內CSS能駕御嗎?
    下面代碼中,包含了引入CSS檔樣式表(藍字)、在<head></head>裡的嵌入式 CSS(綠字)、和行內CSS(橘字): <!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="zh-tw" lang="zh-tw"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>...
  • 我的 CSS 3 測試手記
    先看看以下的測試成品,可按圖放大觀看:中間白色部份是一個沒有設定寬度的區塊,可以在不同瀏覽器解析度下有不同的寬度。透明的白背景,一般最先想到的是用 opacity 和 IE 的 filter 屬性,帶雙白邊的圓角或許會想到用背景圖片,但在支援 CSS 3 的瀏覽器下,不需使用前述也能有相同的效果,而 XHTML 下的結構性代碼也因 CSS 3 的支援而簡化了不少。此次測試中,至目前為止暫時只有 firefox 3.0.5、safari 3.1.2和 Chrome 1.0.154.36 支援,其中圓角效果是通過...
  • IE 下 href 的 BUG
    在瀏覽器 IE6 、IE7、Firefox2+、Firefpx3+、Opera9.6+、Safari3.1+中測試以下代碼(Demo):<div id="test"> <a href="#"> test </a> </div> <div id="result"></div> <script type="text/javascript"> (function(){ var test = document.getElementById('test'); alert(test.innerHTML); var result = document.getElementById('result'); result.innerHTML = test.innerHTML; alert(result.innerHTML) })(); </script> 結果會發現,在 IE6、IE7 瀏...

1 2 »

最 新 發 表 及 資 訊 區

此為池水間 banner ,需要安裝 Adobe Flash Player 才能觀看內容。

最新留言

最新留言:2012-Jan-6 11:13am
留言編號:76
留言者: wuji888
網主回覆:
總留言數: 71

前往萍踪留影

造訪統計

今天:140
昨天:660
本週:1271
本月:2799
總計:373183
平均:290

連結

Powered By XOOPS
Valid XHTML 1.1
Valid CSS 3
登 入